ASP. NET MVC Razor Frequently asked questions and solutions

Inexperienced children's shoes are such a bump out of experience.

1,datatype error message cannot be customized

This may be a bug for ASP. The datatype is defined as the Date field in ViewModel:

        [Required (errormessage = "Birthday must be input!")]        [DataType (datatype.date, errormessage = "Please enter a Date like (2017-07-19).")]        Public DateTime BirthDay {get; set;}

The HTML generated by razor is as follows:

<input name= "BirthDay" class= "Form-control" id= "BirthDay" type= "text" value= "" data-val-required= "BirthDay must be input! "data-val=" true "data-val-date=" field BirthDay must be a date. ">

The required error message is the same as the definition, while the datatype message does not?? Since datatype has the public properties of custom messages Why doesn't it work? If there is a welcome message to know.

Workaround:

Replace the original message with JavaScript on the page load.

$ ("#txtDesignatedDate"). attr (' data-val-date ', ' Please enter a date like (2017/1/1) ');

2,D-MMM-YY format English date validation error in IE, no problem in chrome

The razor model binding settings are as follows:

@Html. labelfor (M = m.birthday, new {@class = "col-md-2 Control-label"}) @Html. textboxfor (M = M.birthday, "{0:d-mm M-YY} ", new {@class =" Form-control "})

Edge Test Condition: Displays error message with incorrect date.

Chrome Test Situation: no error prompt!!

If the date is in the same format as English, the date error message is displayed. What the hell's going on here?

Official website ( http://jqueryvalidation.org/date-method/ In fact, there is also a description:

Look at the JS code:

                Http://docs.jquery.com/Plugins/Validation/Methods/datedate:function (value, Element) {return this.optional ( Element) | | !/invalid| Nan/.test (new Date (value). toString ());},//Http://docs.jquery.com/Plugins/Validation/Methods/dateISOdateISO: function (value, Element) {return this.optional (element) | |/^\d{4}[\/\-]\d{1,2}[\/\-]\d{1,2}$/.test (value);},

Dateiso also only supports authentication in YYYY-MM-DD or YYYY/MM/DD format. There is no way to override the original by overwriting only one validation method.

Workaround:

    (function ($) {        $.validator.methods.date = function (value, Element) {            return this.optional (element) | | Datecheck (value);        }    } (JQuery));

Customizing a Datecheck function is possible.

3,dropdownlist setting default selections occasionally does not work

Action Side settings:

Return View (new Registerviewmodel {BirthDay = DateTime.Now, birthcity = City.shanghai});

View-Side settings:

            @Html. dropdownlistfor (M = m.birthcity, new selectlistitem[] {                new selectlistitem{text= "Jiangxi", value= "1"},                new selectlistitem{text= "Beijing", value= "2"},                new selectlistitem{text= "Shanghai", value= "3"},                new selectlistitem{text= "Shengzhen", value= "4"},            }, new {@class = "Form-control"})

Occasionally such settings cannot select the option set in the action, if there is a welcome message to know the reason.

Workaround: replace the SelectItem list with SelectList.

            @Html. dropdownlistfor (M = m.birthcity, new SelectList (new selectlistitem[] {                new selectlistitem{text= "Jiangxi ", value=" 1 "},                new selectlistitem{text=" Beijing ", value=" 2 "},                new selectlistitem{text=" Shanghai ", value=" 3 " },                new selectlistitem{text= "Shengzhen", value= "4"},            }, "Value", "Text", model.birthcity), new {@class = " Form-control "})

4, password input auto hint in chrome cannot be disabled

AutoComplete = "Off" is not valid after Chrome58. This is a browser problem, no way.

5,disabled control values are not passed on to the server

Workaround: Remove the Disabled property of the control via JavaScript before the submit, and then revert the disabled property after the submit is complete.

The control value for 6,html.hiddenfor () is not updated

Because hiddenfor defaults to using modelstate data first, the Reload screen may hiddenfor control data is old in the case of modelstate validation failure.

Workaround:

Modelstate.clear ();

7,list and dictionary data razor How to bind

ViewModel Properties:

        Public List listtest {get; set;}        Public dictionary> dictest {get; set;}

View-Side bindings:

            @for (int i = 0; i < Model.ListTest.Count; i++)            {                @Html. textboxfor (M = m.listtest[i]. Name, new {@class = "Form-control"})                @Html. textboxfor (M = m.listtest[i]. Phone, new {@class = "Form-control"})            }

            @for (int i = 0; i < Model.DicTest.Count; i++)            {                string key = Model.DicTest.Keys.ElementAt (i);                < input type= "hidden" name= "dictest[@i". Key "value=" @key "/> for                (int j = 0; J < Model.dictest[key]. Count; J + +)                {                    @Html. TextBox ($ "dictest[{i}]. VALUE[{J}]. Name ", Model.dictest[key][j]. Name, new {@class = "Form-control"})                    @Html. TextBox ($ "dictest[{i}]. VALUE[{J}]. Phone ", Model.dictest[key][j]. Phone, new {@class = "Form-control"})                }            }

The resulting HTML is as follows:

<input name= "listtest[0]. Name "class=" Form-control "id=" Listtest_0__name "type=" text "value=" LXB1 "><input name=" listtest[0]. Phone "class=" Form-control "id=" Listtest_0__phone "type=" text "value=" 123 "><input name=" listtest[1]. Name "class=" Form-control "id=" Listtest_1__name "type=" text "value=" Lxb2 "><input name=" listtest[1]. Phone "class=" Form-control "id=" Listtest_1__phone "type=" text "value=" 1234 "><input name=" listtest[2]. Name "class=" Form-control "id=" Listtest_2__name "type=" text "value=" Lxb3 "><input name=" listtest[2]. Phone "class=" Form-control "id=" Listtest_2__phone "type=" text "value=" 12345 ">

<input name= "dictest[0]. Key "type=" hidden "value=" JX "><input name=" dictest[0]. Value[0]. Name "class=" Form-control "id=" Dictest_0__value_0__name "type=" text "value=" LXB1 "><input name=" dictest[0]. Value[0]. Phone "class=" Form-control "id=" Dictest_0__value_0__phone "type=" text "value=" 123 "><input name=" DicTest[0]. VALUE[1]. Name "class=" Form-control "id=" Dictest_0__value_1__name "type=" text "value=" Lxb2 "><input name=" dictest[0]. VALUE[1]. Phone "class=" Form-control "id=" Dictest_0__value_1__phone "type=" text "value=" 1234 "> <input name=" Dic TEST[1]. Key "type=" hidden "value=" SZ "><input name=" dictest[1]. Value[0]. Name "class=" Form-control "id=" Dictest_1__value_0__name "type=" text "value=" Lxb3 "><input name=" dictest[1]. Value[0]. Phone "class=" Form-control "id=" Dictest_1__value_0__phone "type=" text "value=" 12345 "><input name=" DicTest[1]. VALUE[1]. Name "class=" Form-control "id=" Dictest_1__value_1__name "type=" text "value=" Lxb4 "><input ID= "Dictest_1__value_1__phone" class= "Form-control" value= "123456" Name= "dictest[1". VALUE[1]. Phone ">

Where the name of the control is important.

List:viewmodelpropertyname[index].modelpropertyname format.

Dictionary:key set to Viewmodelpropertyname[index]. Key,value set to Viewmodelpropertyname[index]. Value

8, use editorfor as much as possible

For example, the 7th dictest use Editorfor. You first need to create the EditorTemplates folder under the shared or controller itself folder, and then add the partial page in the EditorTemplates folder. The code is as follows:

@using mvcdemo.models; @model list@for (int i = 0; i < Model.count; i++) {    @Html. textboxfor (M = m[i]. Name, new {@class = "Form-control"})    @Html. textboxfor (M = m[i]. Phone, new {@class = "Form-control"})}

Invoke Page Setup:

List of time

@Html. editorfor (M = m.listtest, "_partialperson", $ "listtest")

When the dictionary

                        @for (int i = 0; i < Model.DicTest.Count; i++)            {                string key = Model.DicTest.Keys.ElementAt (i);                <input type= "hidden" name= "dictest[@i]. Key "value=" @key "/>                @Html. editorfor (M = M.dictest[key]," _partialperson ", $" dictest[{i} ". Value ")            }

Generated HTML:

<div class= "col-md-10" >               <input name= "Listtest[0". Name "class=" Form-control "id=" Listtest_0__name "type=" text "value=" LXB1 "><input name=" listtest[0]. Phone "class=" Form-control "id=" Listtest_0__phone "type=" text "value=" 123 "><input name=" listtest[1]. Name "class=" Form-control "id=" Listtest_1__name "type=" text "value=" Lxb2 "><input name=" listtest[1]. Phone "class=" Form-control "id=" Listtest_1__phone "type=" text "value=" 1234 "><input name=" listtest[2]. Name "class=" Form-control "id=" Listtest_2__name "type=" text "value=" Lxb3 "><input name=" listtest[2]. Phone "class=" Form-control "id=" Listtest_2__phone "type=" text "value=" 12345 "></div>

<div class= "col-md-10" > <input name= "dictest[0". Key "type=" hidden "value=" JX "><input name=" dictest[0]. Value[0]. Name "class=" Form-control "id=" Dictest_0__value_0__name "type=" text "value=" LXB1 "><input name=" dictest[0]. Value[0]. Phone "class=" Form-control "id=" Dictest_0__value_0__phone "type=" text "value=" 123 "><input name=" DicTest[0]. VALUE[1]. Name "class=" Form-control "id=" Dictest_0__value_1__name "type=" text "value=" Lxb2 "><input name=" dictest[0]. VALUE[1]. Phone "class=" Form-control "id=" Dictest_0__value_1__phone "type=" text "value=" 1234 "> <input name=" Dic TEST[1]. Key "type=" hidden "value=" SZ "><input name=" dictest[1]. Value[0]. Name "class=" Form-control "id=" Dictest_1__value_0__name "type=" text "value=" Lxb3 "><input name=" dictest[1]. Value[0]. Phone "class=" Form-control "id=" Dictest_1__value_0__phone "type=" text "value=" 12345 "><input name=" DicTest[1]. VALUE[1]. Name "class=" Form-control "id=" dictest_1__value_1__Name "type=" text "value=" lxb4 "><input name=" dictest[1]. VALUE[1]. Phone "class=" Form-control "id=" Dictest_1__value_1__phone "type=" text "value=" 123456 "> </div>

This simplifies a lot and also reaches reuse.

ASP. NET MVC Razor Frequently asked questions and solutions