Adding items to a collection on a ASP.NET MVC site using jQuery and AJAX

Question

I'm creating a UX experience that will allow the user to add items to a collection by using a jQuery button, and some AJAX.

My problem is, when the user finishes adding items and filling out the rest of the form, they complete the form, which I want to carry up to the server in the form of a strongly typed class.

My question is, what is the best approach for adding a new item to a Model's collection using jQuery and Ajax? or is this at all possible?

Example:

<li>
    <div id="shipment">
        <%: Html.EditorFor(x => x.Shipment) %>
    </div>
</li>

x.Shipment is actually a collection inside my Model.

I have buttons in the EditorFor that let the user add items to the shipment.

Then, when the user posts the form, I have the controller set up like so:

[HttpPost]
public ActionResult CompleteReceipt(Receipt receipt)
{
    Context.Update(receipt);
    return RedirectToAction("Index", "Home");
}

What is the best practice or way for using jQuery to add items to my Receipt Model's Shipment collection?

Darin Dimitrov · Accepted Answer · 2010-11-17 18:36:48Z

3

Checkout this excellent blog post from Steve Sanderson. It provides a nice overview of how to achieve what you are looking for and could be considered as best practice. Don't forget to read the follow-up which is about validation if you are interested in this aspect as it could be a bit challenging with dynamic forms.

answered Nov 17, 2010 at 18:36

Darin Dimitrov

1.0m277 gold badges3.3k silver badges3k bronze badges

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

Collectives™ on Stack Overflow

Adding items to a collection on a ASP.NET MVC site using jQuery and AJAX

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related