Question

我在AJAX提交表单序列化和我的图像数据数组中的post请求中有问题。我怎么能这样做？

这是我的代码：

我想发送这些数据：

var Imagedata = new FormData();
jQuery.each(jQuery('#addfiles')[0].files, function(i, file) {
  data.append('file-'+i, file);
});

和

$("#editProd").serialize()

以下是我的所作所为：data: $("#editProd").serialize()+Imagedata,

我将其作为完整代码：

function ProductAjax(e) {
  e.preventDefault();

  var Imagedata = new FormData();
  jQuery.each(jQuery('#addfiles')[0].files, function(i, file) {
    data.append('file-'+i, file);
  });

  $.ajax({         
    url: "{{ route('admin.editProduct') }}",        
    type: "POST",
    data: $("#editProd").serialize()+Imagedata,
    dataType: "JSON",
    success: function(data) {
      if($.isEmptyObject(data.error)){
        $('.print-error-msg-addcat').removeClass('alert alert-danger');
        $('.print-error-msg-addcat').addClass('alert alert-success');
        $('.print-error-msg-addcat').find("ul").html('');
        $('.print-error-msg-addcat').css('display','block');
        $(".print-error-msg-addcat ul").append('<li class="tick">'+data.success+'</li>');
        $('#frmAddcategory')[0].reset();
        location.reload();
      }else{
        printErrorMsgEditprod(data.error);
      }
    }
  }); 
}

我做对了吗？有什么建议吗？

Answer 1

请查看以下代码和评论：

function ProductAjax(e) {
  e.preventDefault();

  var formData = new FormData($("#editProd")[0]); //assuming this object is a form element.
  //the FormData object allows a form element to be passed to the constructor. The new instance
  //will have all the form input fields already appended.
  //if not a form element you need to append every input seperately using jQuery.serializeArray

  jQuery.each(jQuery('#addfiles')[0].files, function(i, file) {
    formData.append('file-'+i, file);
  });


  $.ajax({         
    url: "{{ route('admin.editProduct') }}",        
    type: "POST",
    data: formData, //send the formData object containing all the form input.
    dataType: "JSON",
    success: function(data) {
      if($.isEmptyObject(data.error)){
        $('.print-error-msg-addcat').removeClass('alert alert-danger');
        $('.print-error-msg-addcat').addClass('alert alert-success');
        $('.print-error-msg-addcat').find("ul").html('');
        $('.print-error-msg-addcat').css('display','block');
        $(".print-error-msg-addcat ul").append('<li class="tick">'+data.success+'</li>');
        $('#frmAddcategory')[0].reset();
        location.reload();
      }else{
        printErrorMsgEditprod(data.error);
      }
    }
  }); 
}

AJAX发送数据序列化和图像数据

1 个答案: