work with array passed by jquery to actioncontroller asp.net mvc 3

Question

I would like to know ho to iterate in asp.net mvc3 controller array passed by a jquery ajax call

My Ajax call:

                var array = [];
                array.push({ dir: id });
                array.push({ dirToCreate: $("#txtDir").val() });

                $.ajax({
                    Type: 'GET',
                    url: '/Home/CreateFolder/',
                    data: { 'list': array },
                    traditional: true,
                    cache: 'true',
                    success: function (result) {
                        alert(result);
                    }
                });

And this is my ActionController:

    public ActionResult CreateFolder (IEnumerable<string> list  )
    {
        // how to iterate through the values passed
        return Content("ok");

    }

Actually, can I pass a array to ActionController like that as I am obtaining in the ActionController CreateFolder method object object ?

thanks

Mathew Thompson · Accepted Answer · 2012-04-13 09:17:12Z

Not a straight forward thing to do, but here's a way to do it. First change your ajax method to be:

$.ajax({
        type: 'post',
        datatype: 'json',
        url: '/Home/CreateFolder',
        traditional: true,
        data: { list: JSON.stringify(array)},
        success: function (result) {
            alert(result);
        }
    });

Then in the Controller you'll need to deserialize the json using the JavascriptSerializer class. In my example I've used a class called folder, which is noted below the controller code. You don't have to use this type, it just seemed cleaner if you wanted to pass and use it elsewhere. Do the following in the controller:

    [HttpPost]
    public ActionResult CreateFolder(string list)
    {
        var js = new JavaScriptSerializer();
        var deserializedObject = (object[])js.DeserializeObject(list);
        var myFolders = new List<Folder>();

        if (deserializedObject != null)
        {
            foreach (Dictionary<string, object> newFolder in deserializedObject)
            {
                myFolders.Add(new Folder(newFolder));
            }
        }

        return Json("");
    }

Here is the Folder type that I have used above, along with the constructor that takes the new folder:

public class Folder
{
    public Folder(Dictionary<string, object> newFolder)
    {
        if (newFolder.ContainsKey("dir"))
        {
            Directory = (string)newFolder["dir"];
        }
        if (newFolder.ContainsKey("dirToCreate"))
        {
            DirectoryToCreate = (string)newFolder["dirToCreate"];
        }
    }
    public string Directory { get; set; }
    public string DirectoryToCreate { get; set; }
}

Hi, seems to be very good solution, what differianciate your jquery code from what I have put is the JSON.stringify(), when we pass a json type data from jquery do we need always pass as a JSON.stringify() type ?, some of the code that I have seen doesn' t have it for passing json data to actioncontroller, should we have to specify it each time ?
I have specified datatype: json in my Ajax call that's the only difference (I missed off the cache line in the Ajax call, but you can add that in makes no difference). I only use json.stringify because in this instance we are using a JavaScript array :)

Collectives™ on Stack Overflow

work with array passed by jquery to actioncontroller asp.net mvc 3

1 Answer 1

2 Comments

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Related