CODEWITHSUNDEEP
c#jqueryasp.net-mvcasp.net-mvc-3
carlg
carlg

Reputation: 1812

Pass a collection to MVC controller via jquery

I'm using ASP.NET MVC3 with Jquery. I'm trying to pass my form elements back to the controller using something like this (Please note I removed success and error code for simplicity):

var formElements = $("#myForm").serialize();
        $.ajax({
            type: "POST",
            url: ScriptResolveUrl("~/Report/SubmitChanges"),
            data: {collection: formElements},
            success: 
            error:
            dataType: "json"
        });

My question is what should the parameter in my controller method look like: Here is my controller method:

public ActionResult SubmitChanges(WHAT GOES HERE?)
{
}

So what I'm really looking for is what should be the type of the parameter going into the controller method? I want to be able to retrieve the values of the form elements in the controller.

Upvotes: 3

Views: 846

Answers (4)

Darin Dimitrov
Darin Dimitrov

Reputation: 1038710

You were almost there. Just get rid of the brackets around your data parameter:

var formElements = $('#myForm').serialize();
$.ajax({
    type: 'POST',
    url: ScriptResolveUrl("~/Report/SubmitChanges"),
    data: formElements,
    success: function(result) {
        // handle the success of the AJAX request
    },
    error: function() {
        // an error occurred
    }
});

Upvotes: 0

carlg
carlg

Reputation: 1812

So here is what I did. I have about 20-30 elements on my form so I really didn't want to have to turn each one into a parameter or list them all out in the collection.

In the jquery, I did the following:

 var formElements = $("#myForm").serialize();

        $.ajax({
            type: "POST",
            url: ScriptResolveUrl("~/Report/SubmitChanges"),
            data: { parms: formElements },
            success:
            error: 
            dataType: "json"
        });

It then goes into my controller as a string:

public ActionResult SubmitChanges(string parms)

I then found a function to parse that string (seems to be working)

NameValueCollection qscoll = HttpUtility.ParseQueryString(parms);

This seems to work without listing out all of the form elements.

Upvotes: 1

von v.
von v.

Reputation: 17108

The problem is that their is no model that corresponds to my form elements.

Then you can have this:

public ActionResult SubmitChanges(int id, string name)
{
}

And then pass in the individual items:

var o = {
    id = $("#id_elem_id").val(),
    name = $("#name_elem_id").val()
}
$.ajax({
    type: "POST",
    url: ScriptResolveUrl("~/Report/SubmitChanges"),
    data: JSON.stringify(o),
    success: 
    error:
    dataType: "json"
});

where id_elem_id and name_elem_id are the ids of your html elements. And add any additional parameters you need, just follow along.

Upvotes: 0

Mathew Thompson
Mathew Thompson

Reputation: 56429

Assuming your form elements all correspond to your model (let's say it's MyModel), then it should simply be:

public ActionResult SubmitChanges(MyModel model)
{
}

MVC default model binding will do the rest :).

Make sure you change your data definition in the jQuery ajax method though, you've already serialized it. Just do:

data: formElements,

I'm assuming the following in your jQuery ajax method is a copy and paste error?

success: 
error:

If it's not, then make sure you either remove it, or change them to:

success: function (result) {
    //do something
},
error: function () {
    //do something on error
}

Upvotes: 0

Related Questions