Return array of strings from MVC to jQuery ASP.NET

Question

I want to return an array of strings from an MVC function via a jQuery AJAX call.

My client side code is:

function get_categories() {
    var url = "/Profile/GetCharacters";
    $.post(url, function (data) {
    alert(data);
});

But I cannot read array elements. In alert(data) it always says system.array[] and in alert(data[0]) it says s (i.e. first character in system.array[]) and not the array elements.

Here is simplified version of my server side code.. cause original is big way too complicated :)

public Array GetCharacters()
    {

        var ret = new string[10];
        ret[0]="abc";
        ret[1] = "def";
        ret[2] = "ghi";
        return (ret);
    }

but this gives "System.string[]" instead and same problem when accessing individual values

Answer 1

You can return JSON.

For instance, you could make an Ajax request to the following controller action:

public JsonResult GetMyData()
{
    SomeClass s = new SomeClass();
    s.Property1 = "value";
    s.Property2 = "another value";

    return Json(s, JsonRequestBehavior.AllowGet); //you will need the AllowGet option to return data to a GET request
}

Then, your javascript could make an Ajax request (using jQuery's Ajax function) to the controller:

var onSuccess = function (data) {
    //data will be your s object, in JSON format
};

$.ajax({
    type: 'GET',
    url: '/ControllerName/GetMyData/',
    success: function (data) { onSuccess(data); }
});

EDIT: When returning an array, or List you will need to add the traditional:true option to the Ajax call, like this:

var onSuccess = function (data) {
    //data will be your s object, in JSON format
};

$.ajax({
    type: 'GET',
    url: '/ControllerName/GetMyData/',
    success: function (data) { onSuccess(data); },
    traditional: true
});

I am not 100% sure why (I Iam sure someone will fill us in), but that has given me fits in the past.

One more EDIT: You may need to parse the JSON, which should create an actual javascript Array object for you:

var onSuccess = function (data) {
    //data will be your s object, in JSON format
    var arr = JSON.parse(data);
};