Question

我有这个表单验证通过ajax提交的字段（使用Codeigniter的Form_Validation类）。

<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调用输出这些验证错误的最佳方法？

Answer 1

也许这种方法可以帮助你..它更像是一个提示而不是完整的解决方案......

在服务器端，您将进行验证并返回JSON（例如） - $ progress 是true / false - 取决于验证结果， $ errors 是数组（name，translated_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
    });         

});

使用单个jQuery Ajax调用填充多个元素

1 个答案: