Заполните несколько элементов одним вызовом jQuery Ajax

Question

У меня есть эта форма, которая проверяет поля при отправке через ajax (используя класс Form_Validation Codeigniter).

<input type="text" name="field1" id="field1"> />
<span id="field1_error"></span> 
....
<input type="text" name="field2" id="field2"> />
<span id="field2_error"></span> 
...
<input type="text" name="field3" id="field3"> />
<span id="field3_error"></span> 
<input type="submit" name="submit" id="btnPublish" /> 

При отправке jQuery вызывает метод проверки CI.Каков наилучший способ вывода этих ошибок проверки с помощью одного Ajax Call?

Answer 1

Может быть, этот подход может помочь вам ... это скорее подсказка, чем полное решение ...

На стороне сервера вы выполните проверку и вернете JSON (например) - $ progress - true / false - в зависимости от результата проверки и $ errors - массив (name, translation_error / или "")

частичный php:

$res = array(
    'progress' => $progress,
    'errors' => $errors
);
$jsonReturn = json_encode($res);

//output result
header('Content-Type: text/html; charset=utf-8');       
echo $jsonReturn;

частичное jQuery:

var errorFields = $([]).add(field1_error).add(field2_error).add(field3_error),
    mainFields = $([]).add(field1).add(field2).add(field3);

$('#btnPublish').button().click(function(event){

    mainFields.removeClass('ui-state-error');
    errorFields.val();                                                  

    $.ajax({
    type: 'POST',
    url: your_url,
    data: $('#your_form_id').serialize(),
        async: false,
        success: function (returned_value){
            var obj = $.parseJSON(returned_value);

            if (obj.progress==true){
                alert('Validation successfull');

            }else{
                $.each(obj.errors, function(index, value) { 
                    if (value!=""){ //it will skip those fields with no errors
                        $('#'+index).addClass(('ui-state-error'));
                        $('#'+index+'_error').val(value);
                    }
                });

            }//end return ajax

        }//end ajax
    });         

});