How to send js array via ajax?

Question

I can only send string or numeric values,how to send an array?

Answer 1

You'll probably get a slew of answers all saying "JSON".

Here are some case specific examples. 'data' holds what you send.

var numArray = [17, 42, 23];
data = '[' + numArray + ']';

var strArray = ['foo', 'bar', 'baz'];
data = '["' + numArray.join('", "') + '"]';

For the general case, use a function that recursively encodes objects to JSON. If you really want me to, I'll post an example implementation, but it's a fun project so you might want to give it a try. If you're using a Javascript library, it might have a JSON encoder of it's own (such as jQuery's serializeArray).

Answer 2

I can only send string or numeric values

Actually you can only send strings. When you include a number it is just turned into a string; it's up to the server-side script to parse that back into a number if it wants to.

how to send an array?

The native HTML-forms way of sending multiple values is using multiple inputs. You can reproduce this by including the same named parameter multiple times. To send [1,2,3]:

http://www.example.com/ajax.script?a=1&a=2&a=3

The same multiple-parameter-instance query string can be sent in an AJAX post request.

If you are using a higher-level framework to create the form-encoded string, it depends on the framework how it accepts multiple parameter instances. For example with jQuery you can post an object like {a: [1,2,3]}.

The other way is to forget the standard HTML form encoding and just pass all your values in whatever special encoding you like that allows you to retain datatypes and structure. Usually this would be JavaScript value literals (JSON):

http://www.example.com/ajax.script?a=%5B1%2C2%2C3%D

(that is, [1,2,3], URL-encoded.) You then need a JSON parser on the server to recreate native array values there.

Answer 3

There's are no built-in JSON serializers in javascript so you will need to use a library. A good one is json2.js.

Here's a sample:

// suppose you have an array of some objects:
var array = [{ prop1: 'value1', prop2: 10 }, { prop1: 'value2', prop2: 20 }];
// convert it to json string:
var jsonString = JSON.stringify(array);
// TODO: send the jsonString variable as a parameter in an ajax request
// On the server side you will need a JSON deserializer
// to convert values back to an array of objects