Model meta data and model template for asp.net mvc: predefined templates

Source: Internet
Author: User
Tags bool

One of the main effects of model metadata represented by Modelmetadata is the template methods defined in HtmlHelper and htmlhelper<tmodel> (these template methods include Display/displayfor, Editor/editorfor, Displayformodel/editformodel, Lable/labelfor, and displaytext/displaytextfor provide metadata information for the final generation of HTML. When these methods are invoked, if we specify a specific template through a partial view definition, or if the corresponding Modelmetadata templatehint attribute has a template name, the template is automatically used to generate the final HTML. If you do not specify a template name, you will find a partial view of the template based on the data type in the predefined directory. If it is not found, the default template is used for rendering HTML. To give the reader a general idea of the template, let's do a simple example demo.

Example Demo: To display a Boolean value as RadioButton through a template

By default, property values of a Boolean type are always presented as a checkbox, whether for edit or display mode. We create a type employee that represents an employee, and it has a boolean-type attribute isparttime that indicates whether the employee is moonlighting.

   1:public class Employee
2: {
3: [DisplayName ("name")]
4: Public string Name {get; set;}
5:
6: [DisplayName ("department")]
7: Public string Department {get; set;}
8:
9: [DisplayName ("whether part-time")]
Public bool Isparttime {get; set;}
11:}

If we directly call the Htmlhelper<tmodel> Editorformodel method to display an employee object in a strongly typed view that takes the employee type as model, the following illustration shows the default rendering effect. We can see that a checkbox is corresponding to the Isparttime attribute that indicates whether it is part time.

What we want now is to display all the Boolean type objects as two RadioButton, as shown in the following illustration. Then we can create a template that changes the default rendering of all Boolean-type objects by creating a view with model type Boolean.

Since we need to change the way Boolean objects are rendered in edit mode, we need to define the distribution view as a template in the EditorTemplates directory, which can exist under views/shared or in views/{ Controllername}. Since asp.net MVC uses data types as matching criteria to find the corresponding template, we need to name the partial template view Boolean. The following code fragment represents the entire definition of this division attempt, and we map the two Boolean values (True/false) to the corresponding RadioButton by calling the HtmlHelper RadioButton method, and use the <table> layout.

   1: @model bool
2: <table>
3: <tr>
4: <td> @Html. RadioButton ("", True,model) is </td>
5: <td> @Html. RadioButton ("", false,! Model) No </td>
6: </tr>
7: </table>

It is worth mentioning that we do not specify the name of the RadioButton, but instead specify an empty string, which the HTML itself will name, and the name is based on the core of this chapter: Model metadata. The Isparttime property of employee renders the corresponding HTML in the interface as shown below, we can see that the name of the <input> element with two types radio is automatically assigned the corresponding property name. The drawback is that they have the same ID, and if you want the ID to be unique, you can customize the template more carefully.

   1: <div class= "Editor-label" ><label for= "Isparttime" > whether part-time </label></div>
2: <div class= "Editor-field" >
3: <table>
4: <tr>
5: <td><input checked= "checked" id= "Isparttime" name= "Isparttime" type= "Radio" value= "True" .../> is </td>
6: <td><input id= "Isparttime" name= "Isparttime" type= "Radio" value= "False"/> No </td>
7: </tr>
8: </table>
9: </div>

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.