Undefined Index : PHP variables passing by AJAX

Question

I would like to send my php variables and input file by AJAX with something like this ..

$(document).ready(function(){
    $("#submit").click(function(){ 

        //var formData = new FormData($('form#data')[0]);

        var chaID = "<?php echo $chaID; ?>";
        var row_number = "<?php echo $row_number; ?>";
        var tag = "<?php echo $tag; ?>";
        var data = '&chaID=' + chaID + '&row_number=' + row_number + '&tag=' + tag;

        //Returns successful data submission message when the entered information is stored in database.
        $.ajax({
            type: "POST",
            url: "ajax_challenge.php",
            data : data,
            cache: false,
            success: function(result){

                $('#level').modal('show');

            },
            contentType: false,
            processData: false
        });


        return false;
    });
});

My formData is working fine so let's focus on var data. When I run this function the ajax_challenge.php response "undefined index" but in request part it shown &chaID=7&row_number=2&tag=6 so it should work.

Maybe I did something wrong with php?

$chaID = $_POST['chaID'];
$row_number = $_POST['row_number'];
$tag = $_POST['tag'];

Additionally, is there anyway to mix formData + data correctly?

EDIT . the screenshots of browser's console

response screenshot

request

EDIT2 -----------------------------------------------------------

The thing is, it's gonna work if I remove

            contentType: false,
            processData: false

but the problem is If I deleted it also can't pass var formData input:file through URL. What do I suppose to do ?

Have you watched the AJAX request / response in the browser's console? — Jay Blanchard
– Jay Blanchard, Commented Feb 25, 2016 at 16:17
Hi @JayBlanchard, yes i've watched it the response keep showing undefined index but request displayed &chaID=7&row_number=2&tag=6 so It doesn't mean it's already corrected the values? — Nongkarntt Nitchkarnt
– Nongkarntt Nitchkarnt, Commented Feb 25, 2016 at 16:21
just you need change this '&chaID=' + chaID + '&row_number=' + row_number + '&tag=' + tag; on this '?chaID=' + chaID + '&row_number=' + row_number + '&tag=' + tag; you have no valid post data. — Naumov
– Naumov, Commented Feb 25, 2016 at 16:23
Put those PHP variables into hidden form fields that will get picked up by FormData, — Jay Blanchard
– Jay Blanchard, Commented Feb 25, 2016 at 16:26
@JayBlanchard Hey It request ?chaID=2&row_number=3&tag=7 right now but still not work .__. — Nongkarntt Nitchkarnt
– Nongkarntt Nitchkarnt, Commented Feb 25, 2016 at 16:37

Sergio Mattei · Accepted Answer · 2016-02-25 19:16:18Z

3

I think I see what is going on, you're passing the GET parameters wrong to the data variable.

From my understanding of how jQuery appends GET parameters, the fix would be

'?chaID=' + chaID + '&row_number=' + row_number + '&tag=' + tag

If this doesn't solve it, try checking the console for errors or try to console.log the values. Also make sure you're encodeURI the values before putting them in the URL.

Also, it's better practice to make an array with the GET values and pass them instead to the data variable of the jQuery.ajax() function, as it does the string conversion for you automatically, try doing that instead, it might just solve the problem. ;)

You can find the documentation for the AJAX functions of jQuery and EncodeURI here: http://api.jquery.com/jquery.ajax/

http://www.w3schools.com/jsref/jsref_encodeURI.asp

EDIT: I noticed you're using the POST method, in that case then pass the array of posted values to the data parameter and it should work. Only include the variable values however. Example array:

data = [chaID, row_number, tag];

Pass an array to the data parameter, and it should post the values just fine. Also, try to include in your question a screenshot of the console network tab, which tells us if something is going wrong. Also a console screenshot.

EDIT2: Okay, here are my observations: ProcessData will process the object, therefore it makes sense formData won't work. Try appending the other array:

data = [chaID, row_number, tag];
for (var i = 0; i < formData.length; i++) {
    data.append('formData[]', formData[i]);
}

EDIT3: This should work. Just modify your PHP and JS this way:

  var data = formData;
  var params = $.param({"chaID": chaID, "row_number": row_number, "tag": tag});


//Returns successful data submission message when the entered information is stored in database.
$.ajax({
type: "POST",
url: "ajax_challenge.php?" + params,
data : data ,

and PHP:

$chaID = $_GET['chaID'];
$row_number = $_GET['row_number'];
$tag = $_GET['tag'];

edited Feb 25, 2016 at 19:16

answered Feb 25, 2016 at 16:20

Sergio Mattei

4144 silver badges15 bronze badges

Sign up to request clarification or add additional context in comments.

18 Comments

Nongkarntt Nitchkarnt Over a year ago

okay I'd try to make array instead ._. I fixed a syntax and still not work

Sergio Mattei Over a year ago

@devpro OH I didn't notice he was POSTing instead of GETing, in that case it has to be an obligatory array of values.

devpro Over a year ago

if OP want to use $_GET than just add ? as i mentioned in my answer any way good effort... bro , vote for u

Sergio Mattei Over a year ago

@devpro thank you so much, I will correct the answer

Nongkarntt Nitchkarnt Over a year ago

@SergioE.Diaz I've already edited and included screenshots please take a look. I'm still stuck

|

Kelvin · Accepted Answer · 2016-02-25 16:26:55Z

1

Because you put your php variable to your script. And php compile your code first your javascript run:

var chaID = "<?php echo $chaID; ?>";
    var row_number = "<?php echo $row_number; ?>";
    var tag = "<?php echo $tag; ?>";
    var data = '&chaID=' + chaID + '&row_number=' + row_number + '&tag=' + tag;

And so, you have not click, $_POST['chaID'] and another $_POST variable is not defined.

edited Feb 25, 2016 at 16:26

answered Feb 25, 2016 at 16:23

Kelvin

6903 silver badges11 bronze badges

1 Comment

Sergio Mattei Over a year ago

This is correct unless the file the script is in is a .php file which gets interpreted first before being outputted. In that case which is usually the case (notice the opening tags), this theory is not correct.

devpro · Accepted Answer · 2016-02-25 16:55:55Z

1

If you are using $_POST method in ajax no need to start param data with &

var data = '&chaID=' + chaID + '&row_number=' + row_number + '&tag=' + tag;

Replace with:

var data = 'chaID=' + chaID + '&row_number=' + row_number + '&tag=' + tag;

Also check values in php what are you getting by using print_r($_POST);

answered Feb 25, 2016 at 16:55

devpro

16.1k3 gold badges29 silver badges39 bronze badges

2 Comments

Nongkarntt Nitchkarnt Over a year ago

I replaced it with your syntax. print_r is also undefined.

devpro Over a year ago

@nongkarntt-nitchkarnt change this type: "POST", into method:"POST",

Collectives™ on Stack Overflow

Undefined Index : PHP variables passing by AJAX

3 Answers 3

18 Comments

1 Comment

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

18 Comments

1 Comment

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related