How to Access Array response of AJAX

Question

This is my AJAX call response which is in array format

[1,2,3,4,5,6]

success: function(outputfromserver) {


$.each(outputfromserver, function(index, el) 
{ 


});

How can we access outputfromserver all values ??

Means outputfromserver Zeroth value is 1 , 2nd element is 2 , -----so on

Answer 1

The array is a valid JSON string, you need to parse it using JSON parser.

success: function(outputfromserver) {
    var data = JSON.parse(outputfromserver);
    $.each(data, function(index, el) { 
        // Do your stuff
    });
},
...

Answer 2

You can use JS objects like arrays

For example this way:

// Loop through all values in outputfromserver
for (var index in outputfromserver) {
  // Show value in alert dialog:
  alert( outputfromserver[index] );
}

This way you can get values at first dimension of array, above for..loop will get values like this:

// Sample values in array, case: Indexed array
outputfromserver[0];
outputfromserver[1];
outputfromserver[2];
// So on until end of world... or end of array.. whichever comes first.
outputfromserver[...];

However, when implemented this way, by using for ( index in array ) we not only grab indexed 1,2,3,4,... keys but also values associated with named index:

// Sample values in array, case: accosiated/mixed array
outputfromserver["name"];
outputfromserver["phone"];
outputfromserver[37];
outputfromserver[37];
outputfromserver["myindex"];
// So on until end of world... or end of array.. whichever comes first.
outputfromserver[...];

In short, array can contain indexed values and/or name associated values, that does not matter, every value in array is still processed.

If you are using multidimensional stuff

then you can add nested for (...) loops or make recursive function to loop through all and every value.

Multidimensional will be something like this:

// Sample values in array, case: indexed multidimensional array
outputfromserver[0][0];
outputfromserver[0][1];
outputfromserver[1][0];
outputfromserver[1][...];
outputfromserver[...][...];

Update, JSON object:

If you server returns JSON encoded string you can convert it to javascript object this way:

try { 
    // Try to convert JSON string with jQuery:
    serveroutputobject = $.parseJSON(outputfromserver); 
} catch (e) {
    // Conversion failed, result is not JSON encoded string 
    serveroutputobject = null;
}

// Check if object converted successfully:
if ( serveroutputobject !== null ) {
    // Loop through all values in outputfromserver
    for (var index in serveroutputobject) {
        // Append value inside <div id="results">:
        $('#results').append( serveroutputobject[index] + "<br/>" );
    }
}
// In my own projects I also use this part if server can return normal text too:
// This way if server returned array we parse it and if server returns text we display it. 
else {
    $('#results').html( outputfromserver );
}

More information here

Answer 3

It would help to know what your AJAX request looks like. I recommend using $.ajax() and specifying the dataType as JSON, or using $.getJSON().

Here is an example that demonstrates $.ajax() and shows you how to access the returned values in an array.

$.ajax({
    url: 'test.json', // returns "[1,2,3,4,5,6]"
    dataType: 'json', // jQuery will parse the response as JSON
    success: function (outputfromserver) {
        // outputfromserver is an array in this case
        // just access it like one

        alert(outputfromserver[0]); // alert the 0th value

        // let's iterate through the returned values
        // for loops are good for that, $.each() is fine too
        // but unnecessary here
        for (var i = 0; i < outputfromserver.length; i++) {
            // outputfromserver[i] can be used to get each value
        }
    }
});

Now, if you insist on using $.each, the following will work for the success option.

success: function (outputfromserver) {

    $.each(outputfromserver, function(index, el) {
        // index is your 0-based array index
        // el is your value

        // for example
        alert("element at " + index + ": " + el); // will alert each value
    });
}

Feel free to ask any questions!