通过Ajax发布表单数据和文件

马克·弗拉

文本可以很好地发布，但文件不能发布。
我知道mail-request.php中的php正在工作，因为我使用html表单对其进行了测试。
这是我到目前为止的内容：

$(document).ready(function() {
  $('#btn-quote').click(function() {
    alert("WORKING");
    event.preventDefault();
    $.ajax({
      url: "mail-request.php",
      type: "POST",
      data: new FormData(this),
      contentType: false,
      cache: false,
      processData: false,
      beforeSend: function() {
        $('#load').html('<img src="load2.gif" width="50">');
        $("#err").fadeOut();
      },
      success: function(data) {
        //alert("AJAX: "+data);
        var f_data = data;
        $('#status').text(f_data);
      },
      error: function(errorThrown) {
        $('#status').text("DIDN'T WORK!");
      }
    });
  });
});

形式如下：

<form id ="request-form" name="request-form" action="mail-request.php" method="POST" enctype="multipart/form-data">
<input id="upload" type="file" name="fileUpload" >
      <!--</div>--> 
    </div>
  </div>
  <div class="md-form">
    <div class="md-form">
      <label for="fname" class="request-label">First Name</label>
      <input type="text" id="fname" name="fname" class="form-control">
    </div>
  </div>
<div class="center-on-small-only"> <a class="btn btn-primary" id="btn-quote" onClick="validateRequestForm()">Submit Request</a> </div>
  <div class="status" id="status"></div>
</form>

穆萨

您必须将表单传递给FormData对象的构造函数，就像在div单击处理程序中一样传递DIV。
同样只是为了确保事件变量可用，将其作为参数添加到事件处理函数中

$(document).ready(function() {
  $('#btn-quote').click(function(event) {
    alert("WORKING");
    event.preventDefault();
    $.ajax({
      url: "mail-request.php",
      type: "POST",
      data: new FormData($('#request-form')[0]),
      contentType: false,
      cache: false,
      processData: false,
      beforeSend: function() {
        $('#load').html('<img src="load2.gif" width="50">');
        $("#err").fadeOut();
      },
      success: function(data) {
        //alert("AJAX: "+data);
        var f_data = data;
        $('#status').text(f_data);
      },
      error: function(errorThrown) {
        $('#status').text("DIDN'T WORK!");
      }
    });
  });
});

本文收集自互联网，转载请注明来源。

如有侵权，请联系 [email protected] 删除。