AltTab
AltTab

Reputation: 65

Splitting a JSON Array with JQuery that has been returned by PHP

I am new to JQuery and the whole JQuery to PHP back to JQuery process.

So i have a simple ajax JQuery script:

$.ajax({

           type: "POST",
           url: "includes/calc.php",
           data: {

               'var1':var1,
               'var2':var2,

           },
           success: function(data){
               alert(data);
               $("input#hiddenprice").val(data);
               $('#'+itemprice).html("€"+data);

           }

       })

This goes to a PHP script and then I return a value, using a simple echo

echo $newprice;

The success function above uses this as 'data'. This all works and is fine.

But what if I want to return more than one value.

I think I can used json_encode();

As I understand it something like:

$dataset = array($var1, var2, var3);

echo json_encode($dataset);

But say I have two values, how do i put them both into the JSON and then how do I split them on the other end.

So say 'data' is an array, how do I tell JQuery to split it?

Sorry if this is simple

Upvotes: 0

Views: 6389

Answers (4)

rajkumar
rajkumar

Reputation: 11

implode your php variables with a symbol or any custom data

like

$var[0] = '1st variable';
$var[1] = '2nd variable';
$var[2] = '3rd variable';

echo implode('_SPLIT_',$var);

Now in jquery success function

split the response with 'SPLIT'

as

 var response = data.responseText.split('_SPLIT_');
 var variable1 = response[0];
 var variable2 = response[1];
 var variable3 = response[2]; 

and assign as your wish

Upvotes: -1

Mike Brant
Mike Brant

Reputation: 71384

If you specify the dataType option for .ajax() as json, jQuery will automatically parse the JSON string returned by the call into an appropriate javascript object/array.

So your call might look like this:

$.ajax({

   type: "POST",
   url: "includes/calc.php",
   dataType: "json",
   data: {

       'var1':var1,
       'var2':var2,

   },
   success: function(data){
       alert(data);
       $("input#hiddenprice").val(data);
       $('#'+itemprice).html("€"+data);

   }

})

Now, let's say the response from your PHP script is a JSON string representing an object like this:

{"key1":"value1","key2":"value2"}

In your success handler you can simply access this as an object like this:

   success: function(data){
       alert(data.key1);
       alert(data.key2);
   }

Or, if the returned JSON string represents an array like this:

["value1","value2"]

Then you can access the array values in the success handler like this:

   success: function(data){
       alert(data[0]);
       alert(data[1]);
   }

If you do not want to add the dataType option, you can also opt to manually parse the returned JSON string into an object/array like this:

   success: function(data){
       var dataObj = JSON.parse(data);
       alert(dataObj.key1);
       alert(dataObj.key2);
   }

Upvotes: 1

Blazemonger
Blazemonger

Reputation: 92943

There are many ways to organize data in a JSON object. The simplest is to return a linear array of strings or numbers. Use http://jsonlint.com/ to test your data to see if it's valid JSON, or just feed a PHP array (linear or associative) into json_encode.

If data is a JSON linear array, you can treat it like any other JavaScript array in your success callback:

var first = data[0]; // first element
var second = data[1]; // second element

Upvotes: 0

Sibiraj PR
Sibiraj PR

Reputation: 1481

 $.ajax({

       type: "POST",
       url: "includes/calc.php",
       datatype : 'json',
       data: {

           'var1':var1,
           'var2':var2,

       },
       success: function(data){
           alert(data.firstvalue);
           alert(data.secondvalue);

       }

   })

please look at that datatype. now the respose need to be json.

In your php user json_encode instead of echo.

$firstvalue = 'your first value';
$secondvalue = 'your second value';
echo json_encode(array('firstvalue' => $firstvalue,'secondvalue' => $secondvalue));

Upvotes: 1

Related Questions