Question

我的表单设置为method = post，并且enctype =“ multipart / form-data”带有定期提交的表单信息，并且照片已更新，但是当我要使用Ajax时，已插入了所有内容，但没有插入我的照片！解决方案是什么？

$("#course-frm").submit(function(event){
event.preventDefault();
var formID = 'course-frm';
var form = $("#"+formID+'-container'+" form");
const formData = new FormData(this);
$.ajax({
    url: event.target.action,
    type: event.target.method,
    data: formData,
    cache: false,
    contentType: false,
    enctype: 'multipart/form-data',
    processData: false,
    success: function (data) {
        if(data == 'success'){
            sweetAlertShow('عملیات ثبت با موفقیت انجام شد', 'The operation was Successful', 'success');
            form.trigger('reset');
            $("#course-frm-container").load(" #course-frm-container");
        }else if(data == 'unsuccess'){
            sweetAlertShow('امکان ثبت وجود ندارد', 'The operation was Unsuccessful', 'error');
        }
    },
    error: function(xhr){
        var data = xhr.responseJSON;
        if($.isEmptyObject(data.errors) == false) {
            $.each(data.errors, function (key, value) {
                $('#'+formID +'-'+ key)
                    .closest('.form-group')
                    .addClass('has-error')
                    .append('<span class="help-block">' + value + '</span>');
            });
        }
    }
});

}）;

Answer 1

您需要创建一个表单数据对象。在ajax功能中将processData设置为“ false”。

因为作为对象传递到data选项的数据（从技术上讲，不是字符串）将被处理并转换为查询字符串，以适合默认的内容类型“ application / x-www-form-urlencoded ”。如果要发送DOMDocument或其他未处理的数据，请将此选项设置为false。

JS

  $("form").submit(function(evt){    
      evt.preventDefault(); //prevent refresh
      const formData = new FormData(this); // you need to create a FormData obj to be able to send files
   $.ajax({
       url: 'upload-my-files', //change this to your url
       type: 'POST',
       data: formData, //put formData as body data
       cache: false,
       contentType: false,
       enctype: 'multipart/form-data',
       processData: false,
       success: function (data) {
         console.log(data);
       }
   });
 });

参考文献：

https://developer.mozilla.org/en-US/docs/Web/API/FormData

http://api.jquery.com/jquery.ajax/

如何使用Ajax发送文件？

1 个答案: