PHP array returns null

Question

I have a html form with a button on which there is a onclick event

 <form id = "abc" action = "xyz.php" method = "post">
 <input type="button" name="submitButton" value="Submit" 
 id="submitButton" onclick = "Function()">
 </form>

In the JS code, I am trying to post a value of a textbox and trying to get the array from the PHP through json_encode.

var valueToSend = $('#textbox').val();
var imagesReturned = new Array();
$.ajax({
 url: "xyz.php",
 type: "POST",
 data: valueToSend,
 dataType:"json",
 success: function(result) { 
 var data = jQuery.parseJSON(result);
 alert(data);
 }
 });

And here is my PHP code,

 if(isset($_POST['valueToSend'])) 
 {
 $searchValues = explode(' ',$_POST['valueToSend']);
 // Some processing here
 echo (json_encode($responseArray));
 }

When I alert the data, I get null, What am I missing?

Thanks!

• sh03: What does $responseArray contain?
• user1821499: Its an array of strings.. For example, it contains abc,xyz,pqr etc.
• Ricardo Lohmann: Add a breakpoint on the line that you use parseJSON and see if result is the expected value.
• Gavin: Does your script use any custom buffering?
• N.B.: You don't need var data = jQuery.parseJSON(result); in your callback. It's already parsed. On the other hand, your JSON response from PHP will always be empty. You'll never send the proper response because it'll contain invalid data.

Answer 1

The problem is within your Ajax request, the data key expects a key/value pair, not just a value.

What you're looking for is something similar to the following:

var valueToSend = {
 'valueToSend': $('#textbox').val()
}

In addition, you're setting the dataType key to json, so there is no need to pass the data variable through parseJSON. As such, the success function only needs to be declared as follows:

'success': function(result) {
 alert(result);
}

• Mike Brant: Also note that since you are setting dataType:"json", you don't need to parse the response, jQuery will do that for you such that you can work with the result object directly.
• Joshua Burns: you're absolutely right, i'll update. thanks for catching that :)

Answer 2

var valueToSend = $('#textbox').val();
var imagesReturned = new Array();
$.ajax({
 url: "xyz.php",
 type: "POST",
 data: {"valueToSend":valueToSend},
 dataType:"json",
 success: function(result) { 
 var data = jQuery.parseJSON(result);
 alert(data);
 }
 });

correct the format of data in ajax

• user1821499: If I change data to data: {valueToSend:valueToSend}, The functions returns error, it doesn't go in the success function.

Answer 3

data field of yours look suspicious to me

 $.ajax({
 url: "xyz.php",
 type: "POST",
 data:{valueToSend:valueToSend},
 dataType:"json",
 success: function(result) { 
 alert(result);
 }
 });

• user1821499: Unfortunately, changing the data field doesn't work, it goes inside the error than success function, if i send key : value pair.. If I send just the value its success with null response!
• user1821499: It does not alert anything, If I add code for Error : function, It goes inside that.

Answer 4

The problem was in the PHP code.

I removed the check, if(isset($_POST['valueToSend'])) and its working...