php json - Issue display in returned array order (json sort)

I had a similar problem. My C# application allows the user to override the default sort order of a list of values in a table, so the data passed back to the javascript is not necessarily in alphabetical or numerical order. The data was in the correct order when it left my MVC controller action, but when inspecting the response returned to the browser the list had had been sorted by the numeric key.

Since I needed my select list options to be in the order specified by my user, I tried adding a space to the beginning of my key as recommended by Thamilan, but unfortunately that did not work. Just adding any old character would also not work, since it would still sort it according to alphanumeric sorting rules, and I didn't want it getting sorted at ALL.

So instead I added a counter to the loop that adds to the list being returned to the browser, and pre-pended the value of the counter with a "." to my key as it was being added to the list, so that my returned list looked like this when returned to the browser:

This ensured that the alphanumeric sorting would always be in the order I purposely created. So all I had to do in the javascript was extract out the correct key value for the options list as required by my application. To do this I simply removed the prefixing counter and "." from my key using split:

var optionValue = xhrKey.split(".")[1]; 

The resulting select list was in the same order as that returned from my controller, and with the correct value assigned to the options in the select list.

Append the keys with a space before sending them to browser. This json won't be sorted now.Its a default behavior that in whatever order you send your data, the keys are sorted. But if they are given as string by appending space before the keys, they won't be sorted.

It display correct as json_display.php send to index.html. json_display.php sending indexed array hence it displayed correctly. For example look at your first index of $Array

$Array[1] = array(10 => 'Ten',                   9  => 'Nine',                   8  => 'Eight',                   7  => 'Seven',                   6  => 'Six',                   5  => 'Five',                   4  => 'Four'                  );

It means that 10th index of $Array[1] will have Ten value and so on. So when it comes to the JS it already indexed and will display Four as first option and Ten as last option. You will need to wrap the array key in quotes. So taking your example your array should be converted like this

$Array[1] = array('10' => 'Ten',                   '9'  => 'Nine',                   '8'  => 'Eight',                   '7'  => 'Seven',                   '6'  => 'Six',                   '5'  => 'Five',                   '4'  => 'Four'                  );

This should solve the problem with order you are having. Hope that helps.

Updates:

Since all browser still index array numeric keys, only option IMO is to send proper indexed array. For example php should send back the array in the following format

Array[1] = array(0 =>array("key"=>10, "value"=> 'Ten'),                   1 =>array("key"=>9, "value"=> 'Nine'),                  2 =>array("key"=>8, "value"=> 'Eigth'),                  3 =>array("key"=>7, "value"=> 'Seven'),                  4 =>array("key"=>6, "value"=> 'Size'),                  5 =>array("key"=>5, "value"=> 'Five'),                  6 =>array("key"=>4, "value"=> 'Four'),                  );

Then in index.html you need to modify the response code to.

$.each(theResponse, function( index, obj ) {                $('#second_select_box')                .append($("<option></option>")                .attr("value",obj.key)                .text(obj.value));            });

This might help How do you stop Chrome and Opera sorting JSON objects by Index ASC?