How to send multiple data using AJAX along with the Form Data

Question

I have this ajax code to send form data to a php file called upload.php

My Problem is: I can pass the form-data without any problem, but i i cannot pass another data with it. Everytime I do that, ajax is not pasing data to upload.php

Here's my ajax:

    function upload(fileid, imgno) {
                $(document).ready(function () {

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


                    $.ajax({
                        url: 'includes/upload.php',
                        dataType: 'text', // what to expect back from the PHP script, if anything
                        cache: false,
                        contentType: false,
                        processData: false,
                        data: {
                            data: data,
                            imgno: imgno
                        },
                        type: 'post',
                        success: function (php_script_response) {
                            alert(php_script_response); // display response from the PHP script, if any
                        }

                    });
                });
            }

and is is my upload.php

    if (isset($_FILES['file0'])) { //it doesn't pass this condition
      echo 'B';

    }
    $imageNO = $_POST['imgno']; //this gives undefined index.

How can I fix this problem?

Try using FormData object. See an accepted solution here - https://stackoverflow.com/questions/19295746/how-to-upload-multiple-files-using-php-jquery-and-ajax — Vimal Maheedharan, Dec 26 '18 at 10:39

prashant bana · Accepted Answer · 2018-12-26T10:47:39.417

0

You can append any extra field to the formData object like so:

formData.append(name, value);

and then send it to server side using ajax:

data: formData,

Then fetch on the server side using $_POST[''] OR $_GET[''] whichever method you use

edited Dec 26 '18 at 10:47

answered Dec 26 '18 at 10:42

prashant bana

175
8

Thank you so much. This helped! – Code Maniac Dec 26 '18 at 11:30

score 0 · Answer 2 · answered Dec 26 '18 at 10:57

0

You are sending "file-0" by ajax, but in a condition (PHP) you are checking "file0". Run network monitor and see what the browser is really sending.

answered Dec 26 '18 at 10:57

Tomash

36
3

How to send multiple data using AJAX along with the Form Data

2 Answers2