MVC CRUD Operations Using jQuery JSON and LINQ To SQL Class

Step 1 : Database

Create an EmployeeData table in a SQL database as in the following


Step 2 : LINQ to SQL class

Create a LINQ to SQL class to read data from the table as in the following:



After using the Server Explorer and adding an EmployeeData table in the surface area as in the following:

Now add a controller to the CRUD operations for EmployeeData.

So open the Solution Explorer and right-click on the controller folder and add a controller as in the following:





Step 3 : Controller 

Now create a select controller, an insert controller, an edit controller and a the Delete controller as in the following:

Step  4 : View

Now create a view and a partialview on a right-click corresponding to the controller as in the following:



1. Index View (select data)


In this figure see the view name is auto create, it's not changed. After selecting a Template and Model class as shown in the following figure.

2. Create View (Insert data)
Create a view to create a partial view .


This section also created a script for the model data insert into the table.

Create View Code

3. Edit View (Update Employee)
Also create an Editview as a Partial view.


Edit view code

In this view also create an update record script as in the following.
Finally all the operation views are created and can be seen in the project solution. 

Step: Models

Now create a Model for EmployeeInfo as in the following:





Models Class Code

Now run your MVC example in a browser.


Now click the Add New Employee button and insert a record as in the following:


Now delete the record without 130 with the delete button.





Press the update button and close the dialog and check the record in the webgrid.