jQuery, JSON: Javascript obj/array to json for use with jQuery.ajax.

Question

Hi All,

This is a similar question to this one: http://stackoverflow.com/questions/713884/convert-js-array-to-json-object-for-use-with-jquery-ajax

Except that I have an object that has several arrays in it.

Object looks like (simulated):

{"Users":[1,2,3,4], "Clients":[5,6,7,8], "CompletionStatus":"pastdue", "DateRange":"thisweek"}

and is created like so:

            Filter = new FilterData;

            Filter.Add(9, "Clients");
            Filter.Add(12, "Clients");
            Filter.Add(75, "Clients");

            Filter.Add(9, "Users");
            Filter.Add(12, "Users");
            Filter.Add(75, "Users");

            Filter.SetValue("DateRange", "yesterday");

 function FilterData(){

  this.Users = [];

  this.Clients = [];

  this.Options = [];
  this.Options.CompletionStatus = [];
  this.Options.DateRange = [];

  this.Add = function(id, type){
   this[type].push(id);
   this[type] = this[type].unique();
   return;
  }

  this.Rem = function(id, type){+
   this[type].splice( Filter[type].indexOf(id), 1);
   this[type] = this[type].unique();
   return;
  }

  this.SetValue = function(key, value){
   this.Options[key] = value;
  }

 }

...

If I just do:

AjaxRequest = $.ajax({
...
data: Filter,
...
});

it seems that obj will end up like: ...Users=1&Users=2&Users=3&....

This is causes PHP to only see one value for Users, which will be the last one, in this case 3.

where what I need for PHP to see the arrays properly is: ..Users[]=1&Users[]=2&Users[]=3&....

Any idea how to correct this?

Example:

In firebug, my post looks like this:

Clients 1
Clients 10
CompletionStatus    pastdue
DateRange   14
Users   2
Users   3
Users   4

and my response looks like this:
page: <?php print_r($_POST) ?>

Array
(
    [Users] => 4
    [Clients] => 10
    [CompletionStatus] => pastdue
    [DateRange] => 14
)

Answer 1

Change the name of Users to Users[] in the javascript. 'Users[]' is a valid property name for a javascript object:

var o= { 'Users[]': 'hello user' }; 
alert(o['Users[]']);

Answer 2

Would it be possible for you to just use the built-in param method?

http://docs.jquery.com/Internals/jQuery.param

That seems to do what you want. It also has a few more cool additions in the jQuery 1.4alpha if you want the bleeding edge version.