MVC uses Jquery.ajax () to delete data

Jquery.ajax () can be abbreviated as $.AJAX ().
Previous implementations of MVC deletion, such as "MVC implementation Delete database records" http://www.cnblogs.com/insus/p/3368042.html and "MVC 5 display, creation, editing, deletion and other functions practice"/HTTP Www.cnblogs.com/insus/p/3372916.html. But this time insus.net want to use the Jquery.ajax () method to achieve.

can achieve this function, there are many difficulties encountered and spend a lot of time. When you see this, you will see Insus.net share, and let you less detours oh.

Now that you want to delete the data, the data is in the database, so start with the database and write a deleted stored procedure:



Back to the MVC application, under the Entities directory, modify FruitEntity.cs, adding a method, as follows:



After saving, modify the MVC controller FruitController.cs to add a HttpPost property of the Delete (Fruit objfruit) action.



As long as you know a little bit about MVC, it seems pretty simple. OK, now go to view index.cshtml, this view is "MVC application jquery Dynamic production data" http://www.cnblogs.com/insus/p/3410138.html. We need to modify and add a button on top of it to let it delete the data.

First, add a form and a column to the static HTML in the view, and refer to the highlighted section:



Then modify jquery dynamically generated HTML code, add a hidden input, is used to store the record's primary key value. Adding another is an ammonium button that allows the user to click this Ammonium button to delete the current record.



Next, we can write the Jquery.ajax () method to delete the record. Before you start, you need to think about a few things, the ammonium button above is a dynamic creation of jquery, how to find it, and attached to the click event. The other is the hidden primary key value of the hidden, which is also dynamically generated by jquery, how to get the primary key value of the current row at the time of Ajax post? To say the truth, this part of the insus.net spend a lot of time to solve them, but also to learn jquery access to the most information problem.



In jquery's 1.10.2/jquery.min.js, you can find a delegate () method that enables event delegation for dynamically generated HTML labels. The #48 line in is the same as the function of the #49 row, which is the primary key value to get the record. The #53 line code, after the successful deletion of the database record, should remove () delete the table row.

No practice out of date, to achieve, it will certainly be quite difficult, but $.ajax () delete the implementation, it will feel that it is so simple and easy.

Take a look at the real-time operation demonstration, the instance does not implement the click Delete, first gives a confirmation prompt function, but this function you can see "MVC delete operation before confirm hint" http://www.cnblogs.com/insus/p/3400717.html

Categories: ASP, ASP, JavaScript, JQuery, MS SQL, Stored procedures