CODEWITHSUNDEEP
javascriptphpjqueryajax
Gags
Gags

Reputation: 3829

Uploading data and files in one form using Ajax PHP?

I'm using jQuery and Ajax for my forms to submit data and files but I'm not sure how to send both data and files in one form?

<form id="data" method="post" enctype="multipart/form-data">
<input type="text" name="first" value="Bob" />
<input type="text" name="middle" value="James" />
<input type="text" name="last" value="Smith" />
<input name="image" type="file" />
<button>Submit</button>
</form>

I was planning to use FormData as below

var formData = new FormData($(this)[0]);

but figured out that it does not work in IE<10 and which is not accepted. Is there any other approach for same?

Upvotes: 1

Views: 945

Answers (3)

Pooja Rani
Pooja Rani

Reputation: 11

function savedata(){

var vacancy_desc = CKEDITOR.instances['vacancy_desc'].getData();
   var file_data = $('#fileupload').prop('files')[0];  
   var form_data = new FormData();                  
   form_data.append('file', file_data);
   form_data.append('vacancy_records',vacancy_records);
   form_data.append('vacancy_desc',vacancy_desc);
$.ajax({
        url:pathname,
        method:"POST",
        dataType: 'text', // what to expect back from the PHP script
        cache: false,
        contentType: false,
        processData: false,
        data:form_data,
        cache:false,
        success:function(datas){

                  alert('Updated successfully !');
                  return false;
            }
      });
}

Upvotes: 0

Ritesh Khatri
Ritesh Khatri

Reputation: 1301

You can do like this in php instead of using form data,

Serialize you form data and send through ajax, like,

    $.ajax({
        type: 'post',
        url: 'post.php',
        data: $('#form').serialize(),
        success: function () {
        }
      });

    });

using $('#form').serialize() you can send your all form data to php.

I hope it helps,

Upvotes: 0

Rohit Arora
Rohit Arora

Reputation: 2252

This block should work for you.

$.ajax({
        url: 'url',
        type: 'POST',
        async: true,
        dataType: "json",
        data: $('#data').serializeArray(),
        error: function (a, b, c) { onError(a, b, c, parameters); },
        success: function (data) { onSuccess(data, parameters); }
    });

Upvotes: 1

Related Questions