Sending JSON data using ajax issue

Question

I have the following code:

var arr = {City:'Moscow', Age:25};
$.ajax({
 url: "<? echo $this->createUrl('cities/index');?>",
 type: "POST",
 data: JSON.stringify(arr),
 contentType: "application/json; charset=utf-8",
 dataType: "json",
 async: false,
 success: function(data){
 alert(data);
 }
});

The result is null. In the PHP side I have:

echo json_encode($_POST);

and

print_r($_POST);

But both are giving empty results (checked Firebug also).

• Adrian Preuss: Remove JSON.stringify

Answer 1

You can also set the dataType in Ajax to specify the content type as follows.

 var city='city name';
 var age=10; 
 $.ajax({
 url: "<? echo $this->createUrl('cities/index');?>",
 type: "POST",
 data:"City="+city+"&Age="+age,
 contentType: "application/json; charset=utf-8",
 dataType: "json",
 async: false,
 success: function(data){
 alert(data);
 }
 });

and in cities/index.php you can get this data by follows

if($_POST){
 $city=$_POST['City'];
 $age=$_POST['Age'];
 // and do with $city and $age what you want.
 //for return anything thing to `json` use follows we pass $age back to ajax
 echo json_encode($age);
 }

Answer 2

I guess you don't need to stringyfy the data because data should be PlainObject or String but in your case you can simply write like below

var arr = {City:'Moscow', Age:25};
 $.ajax({
 url: "<? echo $this->createUrl('cities/index');?>",
 type: "POST",
 data: arr,
 contentType: "application/json; charset=utf-8",
 dataType: "json",
 async: false,
 success: function(data){
 alert(data);
 }
 });

as documented in jquery official site https://api.jquery.com/jQuery.ajax/

data

Type: PlainObject or String

Data to be sent to the server. It is converted to a query string, if not already a string. It's appended to the url for GET-requests. See processData option to prevent this automatic processing. Object must be Key/Value pairs. If value is an Array, jQuery serializes multiple values with same key based on the value of the traditional setting (described below).

• Sarvar Nishonboyev: I have one more question. I replaced object to array, var arr= [1, 2, 3]; ... and .. data: JSON.stringify(arr).. but it is not sending, I tried without stringfy also.
• Neel: check this out it might help you stackoverflow.com/questions/8890524/… @SarvarNishonboyev stackoverflow.com/questions/11455000/…
• Sarvar Nishonboyev: I got it, it helped so much. great!

Answer 3

The data option passed to $.ajax() must be either a simple object, that jQuery will transform into a string of the formatkey1=value1&key2=value2.. OR it should be a string of the form key1=value1&key2=value2...

In your case, it can be solved by passing the object itself and letting jQuery do the query string formatting:

$.ajax({
 ...
 data: arr,
 ...
});

Answer 4

try this

var arr = {City:'Moscow', Age:25};
 $.ajax({
 url: "<? echo $this->createUrl('cities/index');?>",
 type: "POST",
 data: arr,
 contentType: "application/json; charset=utf-8",
 dataType: "json",
 async: false,
 success: function(data){
 alert(data);
 }
 });