Handling Multiple Entries and One Time Post in ASP.NET MVC

Introduction

One type of Data Entry patterns in Web Application is multiple data entry. Examples of these multiple data entry are orders entry, guests registration, etc. In this example we will be using Client Registration. Below is a screenshot on what we will be working.

Download:

What does it do?

1. Allow users to enter unlimited clients by clicking the New Client button and enters the information of the client.
2. The User can delete the entry without server round trips (it's happening on the client side).
3. Save all the entries at once.

Technologies used

• ASP.NET MVC 4
• jQuery
• CSS
• HTML 5

How do we do this?

One approach is to loop through the web form and capture the values in the form. We can do this in the controller. That's it!

The Code:

Let's create the client model first.

The View:

We are going to use plain HMTL and jQuery to do the data capturing. We use jQuery to manipulate the DOM.

The Controller:

In the controller, we loop through the form and capture the data. Save it to a list and we can save it to SQL Server data store or process further.

How to Verify:

One way to verify that the data has been captured is by placing a breakpoint and run the application in a debug mode.

Hope this article helps. Share it with your friends!