Question

我在CodeIgniter3框架中编写了一些代码。我编写了一个代码，在输入字段之后立即显示带有Ajax的表单验证。但是，我添加了＃34;上传图片＆＃34;因此，函数改变了我的ajax文件：

$(document).ready(function() {
$("#continueregistrationform").unbind('submit').bind('submit', function() {
    var form = $(this);


$.ajax({
    url: form.attr('action'),
    type: form.attr('method'),
    data: form.serialize(),
    async : false,
    cache : false,
    processData : false,
    dataType: 'json',
    success:function(response) {
    console.log(response);              
        if(response.success) {                  
            $("#messages").html(response.messages);
            $("#continueregistrationform")[0].reset();
            $(".text-danger").remove();
            $(".form-group").removeClass('has-error').removeClass('has-success');
            location.href = "http://localhost/edu-center/";

        }
        else {
            $("#messages").html(response.messages);
            $.each(response.messages, function(index, value) {
                var element = $("#"+index);
                $(element).parent('div').find('.text-danger').remove();
                $(element).after(value);

            });
        }
    } // /success
});  // /ajax

return false;
}); 
});

到：

$(document).ready(function() {
$("#continueregistrationform").unbind('submit').bind('submit', function() {
    var formData = new FormData($('#continueregistrationform')[0]);
$.ajax({
    url: formData.attr('action'),
    type: formData.attr('method'),
    data: formData,
    async : false,
    cache : false,
    contentType: false,
    processData : false,
    dataType: 'json',
    success:function(response) {
    console.log(response);              
        if(response.success) {                  
            location.href = "http://localhost/edu-center/";
        }
        else {
            $("#messages").html(response.messages);
            $.each(response.messages, function(index, value) {
                var element = $("#"+index);
                $(element).parent('div').find('.text-danger').remove();
                $(element).after(value);

            });
        }
    } // /success
});  // /ajax

return false;
}); 
});

现在，它不是在输入字段下显示像以前那样的错误，而是在一个新的空白页面中显示它们。哪里可能出现问题？提前谢谢！

Answer 1

我个人不会使用formData.attr来设置动作和方法。您可能需要验证formData.attr（'action'）和formData.attr（'method'）的值是否符合您的预期。

根据我个人的经验，正是您正在做的事情，这是我添加图像并将变量发布到ajax请求的方式：

// Add file
var formData = new FormData();
var fileInput = $('#your_image_upload_field')[0];
var file = fileInput.files[0];
formData.append('userfile[]', file); // MUST HAVE [] OR PHP HAS NO $_FILES !!! 
// Add post vars
formData.append('a', a);
formData.append('b', b);
formData.append('c', c);
// Do post
$.ajax({ //...

在Ajax中将表单更改为FormData后，codeigniter表单验证不起作用

1 个答案: