0

I am working on a sales application. My popup form contains inputs for a deal amount, contract number, and a copy of a contract as a file attachment. I am using AJAX to submit the form to an action page. On the action page, I receive all values from the form except for the file.

How can I receive the file upload via AJAX?

var file = document.getElementById("file_attach");
var form_data = file.files[0];
var form_data += $('#deal_frm_brief').serialize();

$.ajax({
  type: 'POST',
  url: '../followup_action.php',
  processData: false,
  contentType: false,
  data: form_data,
  success: function(response) {
    $('#contract_number_popup').hide();
    $('#deal_content_popup').html(response);
  }
});

<form role="form" name="deal_frm_brief" id="deal_frm_brief" enctype="multipart/form-data" \>
  <div class="form-group" id="deal_content_popup">
    <label>Enter deal amount in numbers</label>
    <input type="text" class="form-control" name="txt_brief" id="deal_txt_brf" required>
  </div>
  <div class="form-group" id="contract_number_popup">
    <label>Enter Contract number</label>
    <input type="text" class="form-control" name="txt_contract" id="contract_number" required>
  </div>
  <input type="file" name="cntrctattch" id="file_attach" />
</form>
showdev
  • 28,454
  • 37
  • 55
  • 73
Mathew
  • 91
  • 4
  • This answer might have solution to your problem: http://stackoverflow.com/questions/4545081/how-to-do-file-upload-using-jquery-serialization – Raja Amer Khan Jun 16 '15 at 12:31
  • 1
    thanks buddy. http://stackoverflow.com/questions/166221/how-can-i-upload-files-asynchronously/8758614#8758614 this resolved my problem – Mathew Jun 18 '15 at 07:28

0 Answers0