Use Knockout practice 07 in ASP. net mvc to customize the location and content of authentication information, mvcknockout

Use Knockout practice 07 in ASP. net mvc to customize the location and content of authentication information, mvcknockout

In the first two articles, I used the basic verification and custom verification of Knockout. This document defines the display location and content of the authentication information.

 

Display location of custom authentication information

 

Generally, the verification information of Knockout follows the input, and the display position of the verification information can be customized through the validationMessage attribute.

@{
    ViewBag.Title = "Index";
    Layout = "~/Views/Shared/_Layout.cshtml";
}
<style type="text/css">
    .error {
        color: red; 
    }
</style>
<div>
    <input type="text" data-bind="value: name"/>
    <p class="error" data-bind="validationMessage: name"></p>
</div>
@section scripts
{
    <script src="~/Scripts/knockout-3.2.0.js"></script>
    <script src="~/Scripts/knockout.validation.js"></script>
    <script src="~/Scripts/zh-CN.js"></script>
    <script type="text/javascript">
        
// Create a View Model using the constructor
        var Product = function () {
            this.name = ko.observable().extend({ minLength: 3 });
        };
     
// Create an instance
        var product = new Product();
// Verify settings
        var knockoutValidationSettings = {
            insertMessages: false,
            decorateElement: false,
            errorMessageClass: 'error',
            errorElementClass: 'error',
            errorClass: 'error',
            errorsAsTitle: true,
            parseInputAttributes: false,
            messagesOnModified: true,
            decorateElementOnModified: true,
            decorateInputElement: true
        };
        ko.validation.init(knockoutValidationSettings, true);
       
// Bind
        ko.applyBindings(product);
       
        $(function () {
            ko.decorateElement = false;
        });
    </script>
}

Above,
● The verification information is displayed on the input whose data-bind attribute value is validationMessage: name.
● The Knockout-Validation must be re-initialized using ko. validation. init ().
● InsertMessages indicates whether to display the verification information at the position followed by input.
● DecorateElement indicates whether to add class = "error" to the input"

 

 

Content of custom authentication information

 

Modify the content of the verification information as follows:

        var Product = function () {
This. name = ko. observable (). extend ({minLength: {params: 3, message: "to me, the minimum length is 3 "}});
        };

How to verify the text box in aspnet mvc Mode

... Verify with JS or use verification controls.
However, the client verifies the service. 3. The client also verifies the service. Because some Browsers Do not support Javascript
Client Verification:
<Script language = "javascript" type = "text/javascript">
Function fn ()
{
Var str = document. getElementById ("TextBox1"). value;

If (str. length = 0)
{
Alert ("Enter cannot be blank ");
Document. getElementById ("TextBox1"). focus ();
Return false;
}
}
</Script>
 
In aspnet mvc model verification, how does one handle the drop-down list?

What is simulated verification. Prompt the user to select when the user has not selected