Webpages (razor) development-form validation

Source: Internet
Author: User

Before using razor, form verification has been a problem for me and needs

1, in the background code for the data after the submission of a verification

2, in the front-end with JS method in the pre-submission of data to verify once

Both validation rules need to be defined in both steps.

After using the razor, these two-step verification can be unified. See a simple User login demo

The first step is to set the validation rules

1     stringAccountmsg ="6-12 English letters and numbers"; 2Validation.add (" Account", validator.required (accountmsg), Validator.stringlength ( A,6, accountmsg),3Validator.regex (Library.Validate.RegexAccount (6, A) , accountmsg));4         5Validation.add ("Password", Validator.required ("The password is 6-12 English letters and numbers"), 6Validator.stringlength ( A,6,"The password is 6-12 English letters and numbers"));

The second step of the front-end validation call so that the data can be validated before the data is submitted

<inputclass="InputBox"Type="text"Maxlength=" A"Placeholder="User name"Name=" Account"Value="@Request ["Account"]"@Validation. for (" Account")/><inputclass="InputBox"Type="Password"Maxlength=" A"Placeholder="Password"Name="Password"@Validation. for ("Password")/>--Error Output @html.validationmessage (" Account") @Html. Validationmessage ("Password")

Third step background validation call, data validation after submission

if (IsPost && validation.isvalid ())

{

// ....

}

The validation is based on Jquery.validate, and razor expands on this.

So if you need to use this function, you need to reference

1, Jquery.js

2, Jquery.validate.min.js

3, Jquery.validate.unobtrusive.min.js

These three files when you create a new razor site, vs will bring it, Jquery.js will have the difference between the specific version number.

The above demo in this simple scenario, the advantage is not obvious, in the need for a large number of information input form scenario, the advantages are reflected.

The above is just a simple demonstration, there will be a variety of complex verification scenarios in the actual use of the process

For example, multiple form forms within a page

This only needs to pay attention to post the background authentication method, will Validation.isvalid () modified to verify the specific fields such as Validation.isvalid ("account", "password")

For example, combination input validation

This is a bit more complicated, because the razor verification mechanism does not have the function of combination verification at present, it needs to be self-expanding in front of the background.

Simply put, the original way of using jquery.validate is verified in the front-end for the place where the combination verification is required, such as

Then add extra judgment in the background.

such as Remote authentication

This does not use the jquery.validate in the remote function, because each keyboard input will be triggered, do not want this (probably because I am not familiar with jquery.validate),

So I wrote a JS method, onblur when the trigger.

Add:

If required in the background code, output validation error message with Modelstate.adderror ("", "");

If you need to output an error message with Html code, you need to use Html.raw (Server.htmldecode ("Account") (Html.validationmessage). ToString ()))

In the actual use of the process also found a lot of pits,

If the validation rule uses the Validator.stringlength method, the field becomes mandatory. The solution is to use the Validator.regex + regular expression.

Webpages (razor) development-form validation

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.