ASP. NET mvc4 uses HTML. dropdownlist and HTML. beginform

To display the drop-down list on the page, you can directly use the <SELECT> element of HTML to render it as follows: 

 
<Select id = "selectedarea"> <option value = "-1"> -- select -- </option> <option value = "1"> Beijing </option> <Option value = "2"> Shanghai </option> <option value = "3"> Guangzhou </option> <option value = "4"> Shenzhen </option> <option value = "5"> Tianjin </option> </SELECT>
 

In ASP. net mvc, you can use @ html. dropdownlist to create a drop-down list.

Data preparation in controller is as follows:

// Obtain the region information list <deptinfo> deptlist = theapputil. getareasbyloginname (loginname); // list of data prepared for the dropdownlist on the foreground page <selectlistitem> deptselectitems = new list <selectlistitem> (); deptselectitems. add (New selectlistitem () {text = "select", value = "-1", selected = true}); foreach (deptinfo D in deptlist) {selectlistitem item = new selectlistitem (); item. TEXT = D. deptname; item. value = D. deptid. tostring (); item. selected = false; deptselectitems. add (item);} viewdata ["deptselectitems"] = deptselectitems; // ----- end -----
 

In the controller, a list <selectlistitem> Object deptselectitems is created, and the selectlistitem type object data is filled in deptselectitems. You can create a selectlistitem object in the preceding two ways. After the data preparation is complete, you can save the deptselectitems object to viewdata for the view to use.

On the front-end cshtml pageCodeAs follows:

VaR deptselectitems = (list <selectlistitem>) viewdata ["deptselectitems"]; <ul data-role = "listview" data-inset = "true"> <li data-role = "list-divider"> select region </LI> <li data-Role = "list-divider"> @ HTML. dropdownlist ("selectedarea2", deptselectitems) </LI> </ul>
 

As follows:

 

Html. beginform is also relatively simple to use. Just write the following code in cshtml:

 
@ Using (html. beginform () {// html element}
 

Place the control to be submitted in the "{}" range. Set parameters for beginform as follows:

@ Using (HTML. beginform ("Index", "login", formmethod. get )) {<ul data-role = "listview" data-inset = "true"> <li data-role = "list-divider"> select a region </LI> <li data -Role = "list-divider"> @ HTML. label ("username") @ HTML. textbox ("username") </LI> <li data-role = "list-divider"> @ HTML. label ("password") @ HTML. textbox ("password ") </LI> <li data-role = "fieldcontain"> <input type = "Submit" value = "Logon"/> </LI> </ul>}
 

Define the following method in the control logincontroller:

This method uses the simplest get method to process requests. Of course, in practice, the usermodel class will be used as the post data for requests. Here we just want to experiment with the usage of HTML. beginform

[Httpget] public actionresult login (string username, string password) {// execute logon user = loginservice. login (username, password); // If (user! = NULL) {// The user login name is stored in the session ["login_user"] = user. username; // login successful, go to the home page return view (".. /home/Index ");} // return to the logon page return view (" login ");}
 

Check the logon interface and use the default CSS style of ASP. NET mvc4: