Home > Developer > Web Develop
Both of the data validation methods used in the previous two sections are performed on the server side, that is, the form is submitted and the data is passed back to the server for verification. This will bring two problems, one is the user experience is not good, the user submitted the form before they know that there is a problem, the second is to bring additional pressure on the server. We can use client-side validation to address both of these issues.
Client-side validation typically uses JavaScript scripts, and Jquery.validate is a good JQuery validation component that many projects will use to implement client-side validation.
Step 1. Add a scriptASP. NET MVC has good support for jquery, which is actually integrated in the former, and a new MVC project template has built-in jquery, Jquery.validate. But Messsageboard is a project created by an empty template, so we need to add these script files manually in the project. Add the Scripts folder to your project and place the downloaded JQuery, Jquery.validate, and JQuery.validate.unobtrusive.
These scripts are added to the write view in turn, paying attention to the order of precedence.
<HTML><Head> <Metaname= "Viewport"content= "Width=device-width" /> <Scriptsrc= "~/scripts/jquery-2.1.4.min.js"></Script> <Scriptsrc= "~/scripts/jquery.validate.min.js"></Script> <Scriptsrc= "~/scripts/jquery.validate.unobtrusive.min.js"></Script> <title>Write</title></Head><Body> <H1>MVC Message Board</H1>@using (Html.BeginForm ("Write", "Home") {@Html. Labelfor (M=>m.nickname, "nickname") @Html. Textboxfo R (m = m.nickname) @Html. Validationmessagefor (m=>m.nickname)<BR/><BR/>@Html. Labelfor (M + m.content, Contents) @Html. textareafor (M = m.content,5,50,null) @Html. Vali Dationmessagefor (m=>m.content)<BR/><BR/> <inputtype= "Submit"value= "Submit" /> }</Body></HTML>Step 2. Turn on client authentication
By default, the ASP. NET MVC project has already turned on client-side validation. Opening the Web. config file, you can see that both the clientvalidationenabled and unobtrusivejavascriptenabled key values are true, indicating that client authentication is supported. As shown in.
You can also enable or disable client-side validation for a single view, such as in the Write view, we can set htmlhelper.clientvalidationenabled = True to enable client-side validation.
@model messageboard.models.message@{ Layout = null; htmlhelper.clientvalidationenabled = true;} <! DOCTYPE HTML > ...Give it a try and you'll see the effect of client-side validation. However, client-side validation has its limitations, and if the user's browser does not support or turn off JavaScript usage, client-side validation is completely invalidated. Therefore, to use the client and server side together, you cannot rely solely on client authentication.
ASP. NET MVC Light Tutorial Step by Step 12--client validation
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
