MVC edit State Two DropDownList linkage

The previous days, using jquery in an MVC application, implemented the jquery implementation of two DropDownList linkage (MVC) http://www.cnblogs.com/insus/p/3414480.html. This exercise is also carried out on this basis.

Insus.net wants to implement two DropDownList linkage in the MVC edit state. This is not much different from the former, only one in the MVC add State, and the other in the MVC edit state. The main thing about the latter is that when MVC is first loaded, the value of the data is bound to the DropDownList option.

During this time, the MVC exercise was actually a practice of jquery, just in the MVC application. The HTML code is generated dynamically using jquery. In jquery to get these dynamically generated HTML tags or elements, the difficulty is still quite large.

Since it is an editor, starting with MVC editing, you need to create an update stored procedure to create an MVC update view.

To modify the Entities\fruitentity.cs under the MVC application, add an updated method, as follows

Go to controller Modify Controllrs\fruitcontroller.cs, add two ActionResult, one is return views (), one returns JSON, and the second attached property httppost.

Next, you should create the update view, but before you do, you need to go to the index.cshtml view to add a link that will let the user click on the link, and MVC turns the chain to the update.cshtml view. Need to modify the place, is nothing more than the following highlighted part of the code:



OK, now you can create a update.cshtml view:

Start writing jquery:
First, copy a parameter method that receives the address bar, that is, receive the parameters from the index.cshtml view. Insus.net the previous article, "MVC application uses jquery to receive URL parameters," http://www.cnblogs.com/insus/p/3410473.html has been detailed.

Ajax using jquery is based on receiving a primary key to get this record:

The following is the detailed syntax for custom function Outputdata (Tbody,item):



, there are also two <select> tags. will be used to show the category and kind. This is just a blank tag, and insus.net will implement binding data later on. To be sure, the data for these select is also from the database.

In order to implement DropDownList, drop-down lists, you need to write two extension custom functions first.



The following is the implementation of the drop-down list, one thing to note is that the code is written in the above custom function Outputdata (tbody,item), otherwise we will not be able to get jquery dynamically generated HTML tags.

In the serial number description:
1, dategory bind data for the first drop-down list.
2, kind bind data for the second drop-down list.
3, is to implement the linkage Change event, the first drop-down list has a selection change, the second drop-down list according to the parameters to display the corresponding data.
4 and 5, are the second drop-down list that records the value of the original category, which is the category value that the user selects when it is added.
6,7 and 8 are also meant to bind the default values so that the drop-down list which option is the selected state. And why is the number 8 a 0? As soon as the first drop-down list changes, the second first option is "SELECT ...".

The two drop-down lists in the MVC edit record are implemented in tandem. Next is the ability to implement the update, $.ajax is also written in the above custom function Outputdata (Tbody,item):



The entire function that needs to be implemented, complete, and see the real-time demo operation:



Until this exercise, all source programs and databases can be downloaded from the following links:
Http://download.cnblogs.com/insus/MVC/InsusMVCSiteCS_2013Nov16.rar