passing data in javascript array to server with jQuery.ajax post function?

Question

I was wondering if its possible to pass data stored in a javascript array to the server using jQuery's ajax function..

In the jQuery documentation it specifies:

$.ajax({
  type: 'POST',
  url: url,
  data: data,
  success: success,
  dataType: dataType
});

can "data" be set to an array? How would this work given it seems data is expecting key value pairs? I currently just hard code the values but I want it to be a more dynamic approach..my current code is:

jQuery.ajax({
            url: "/createtrips/updateitin",
            type: 'POST',
            data: {place1: 'Sydney', place2: 'London'},
            dataType: 'json',
            });

Christian Specht · Accepted Answer · 2011-12-31 16:08:52Z

8

I created an array like this:

var placesfortrip = {};

then added to it like this:

placesfortrip["item"+counter] = inputVal;

(where counter is an incremented counter variable) then assigned this to the data property of the ajax call

 jQuery.ajax({
            url: "/createtrips/updateitin",
            type: 'POST',
            data: placesfortrip,
            dataType: 'json',
            });

and if I look at the XHR tab in firebug it appears those values get posted!

edited Dec 31, 2011 at 16:08

Christian Specht

36.6k16 gold badges132 silver badges190 bronze badges

answered Dec 31, 2011 at 14:46

Rowan

4633 gold badges8 silver badges20 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Kevin Ji · Accepted Answer · 2011-12-25 21:49:33Z

2

Yes, jQuery.ajax() supports the passing of arrays. It simply serializes the array into a name-value string.

If value is an Array, jQuery serializes multiple values with same key based on the value of the traditional setting (described below).

answered Dec 25, 2011 at 21:49

Kevin Ji

10.5k4 gold badges43 silver badges65 bronze badges

Comments

Travis J · Accepted Answer · 2011-12-25 21:50:24Z

0

I believe you would like to look into using JSON to pass those values.

This is a good place to start

answered Dec 25, 2011 at 21:50

Travis J

82.5k43 gold badges213 silver badges280 bronze badges

1 Comment

Rowan Over a year ago

I created an array like this:

Derk Arts · Accepted Answer · 2011-12-25 21:50:31Z

0

Check out jQuery serialize: http://api.jquery.com/serialize/

$('form').submit(function() {
  alert($(this).serialize());
  return false;
});
This produces a standard-looking query string:

a=1&b=2&c=3&d=4&e=5

answered Dec 25, 2011 at 21:50

Derk Arts

3,4702 gold badges20 silver badges36 bronze badges

1 Comment

Rowan Over a year ago

Do you have an example? It doesn't seem to support serialize (?)

Collectives™ on Stack Overflow

passing data in javascript array to server with jQuery.ajax post function?

4 Answers 4

Comments

Comments

1 Comment

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

Comments

1 Comment

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related