4

I am using jQuery UI sortable to sort a list in the DOM. I succesfully have an ajax functionposting this string to my mvc action:

list[]=2&list[]=3&list[]=28&list[]=1

I'm trying to figure out how to get this serialized list of numbers into a List<int> so I can actually access them from C#.

How would I do this? I've already tried this method:

    [HttpPost]
    public string RoleTierUpdate( string[] form)
    {
        StringBuilder sb = new StringBuilder();

        foreach (var item in form)
        {
            sb.AppendFormat("id: {0}<br />", item);
        }

        return sb.ToString();
    }

I was thinking I could convert the array of string into a list of integers. But this returned the following output:

    id: 2
    id: ,
    id: 3
    id: ,
    id: 2
    id: 8
    id: ,
    id: 1

Is ther an easier way of getting this data into a list of int?

Edit

Here's the code that executes the ajax post:

<script type="text/javascript">
    // Sortable
    $(document).ready(function () {
        $("#sortThis").sortable({
            handle: '.handle',
            update: function () {

                // get new order
                var order = $('#sortThis').sortable('serialize');

                // excecute ajax for db update
                $.post(
                    "/find/AdminMember/RoleTierUpdate/",
                    order,
                    function (data) {
                        $("#info").html(data);
                    }
                );

                $("#info2").html(">>" + order + "<<");
            }
        });

    });
</script>

order contains the string I showed above.

Edit 2

Updated controller to:

    [HttpPost]
    public string RoleTierUpdate( List<int> list, MemberData md) // change to List<int> list
    {
        StringBuilder sb = new StringBuilder();

        if (list != null) // added check for null
        {
            foreach (var item in list)
            {
                sb.AppendFormat("id: {0}<br />", item);
            }
        }
        else {
            sb.Append("form is null");
        }

        return sb.ToString();
    }

Updated ajax to:

    $(document).ready(function () {

        jQuery.ajaxSettings.traditional = true; // added

        $("#sortThis").sortable({
            handle: '.handle',
            update: function () {

                // get new order
                var order = $('#sortThis').sortable('serialize');

                // excecute ajax for db update
                $.post(
                    "/find/AdminMember/RoleTierUpdate/",
                    order,
                    function (data) {
                        $("#info").html(data);
                    }
                );

                $("#info2").html(">>" + order + "<<");
            }
        });

    });

The output from this is:

form is null
2
  • Did you try using public string RoleTierUpdate( List<int> form) Commented Dec 17, 2010 at 0:40
  • @Mahesh - Yes, I did try that as well. When I do that form is null. I suspect it's because that serialized string uses list[] as the collection key. I tried doing somthing like List<int> list but that returns null as well. And, List<int> list[] is not a valid statement. So, I suspect that I'm not able to use mvc's modelbinder to accomplish this. Commented Dec 17, 2010 at 0:47

2 Answers 2

2

It appears that the reason MVC's modelbinder wasn't willing to bind the string

list[]=2&list[]=3&list[]=28&list[]=1 

to a List<int> list is because of the "[]" in the keys. I added this javascript to my jQuery:

// get new order
 var order = $('#sortThis').sortable('serialize');
 order = order.replace(/\[\]/gi, "")

Once I took out the "[]" from the keys everything was great. The action returned this result:

id: 2
id: 3
id: 28
id: 1

Which is exactly what I needed. The modelbinding to List<int> is working great.

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

Comments

0

ASP.NET will automatically detect that you're trying to use a list. Do this:

[AcceptVerbs(HttpVerbs.Post)]
public ActionResult RoleTierUpdate(List<String> list)

or swap out String for Int32 if you are expecting integers.

4 Comments

Of course you are able to. Are you using jquery by any chance to send the data back to the server?
It's possible you may need to change some settings. At the top of your javascript file, add this line: jQuery.ajaxSettings.traditional = true; and try again. If this doesn't work, try stepping through your debugger to find out what exactly you're getting from the server.
@quakkels, put that line on the top of your file, outside of any functions or anything. should just be the first line of your js file.
As long as that line executes before the actual ajax does... I really doubt that it matters where it is.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.