Example of jQuery form verification plug-in jqBootstrapValidation

JqBootstrapValidation is a jQuery validation plug-in for the bootstrap framework style form. It can verify basic form field types, such as the email format, pure numbers, pure denominator, and whether the fields are empty, it depends on the form style of the bootstrap framework and the Jquery JavaScript framework to find and edit HTML tags.

Install

Download the jqbootstrapvalidation script tag that includes your web page:

The code is as follows:	Copy code
<Script src = "/js/jquery. min. js"> </script> <! -- Or use local jquery --> <Script src = "/js/jqBootstrapValidation. js"> </script>

You want to verify that the jqbootstrapvalidation element is applied

The code is as follows:	Copy code
<Script> $ (Function (){ $ ("Input, select, textarea"). not ("[type = submit]"). jqBootstrapValidation (); }); </Script>

Jqbootstrapvalidation checks the HTML5 validator attributes directly in the element, and adds any additional options through the specified data attributes. See the description here.

Verify field type

The code is as follows:

Copy code

Email <Form class = "form-horizontal"> <Div class = "control-group"> <Label class = "control-label"> Email address </label> <Div class = "controls"> <Input type = "email"/> <P class = "help-block"> </p> </Div> </Div> </Form> Attribute Value Req? Type email & radic; Data-validation-email-message (your failure message) Numeric type <Form class = "form-horizontal"> <Div class = "control-group"> <Label class = "control-label"> Type a number </label> <Div class = "controls"> <Input type = "number"/> <P class = "help-block"> </p> </Div> </Div> </Form> Attribute Value Req? Type "number" & radic; Data-validation-number-message your failure message Cannot be blank <Form class = "form-horizontal"> <Div class = "control-group"> <Label class = "control-label"> Type something </label> <Div class = "controls"> <Input type = "text" name = "some_field" required/> <P class = "help-block"> </p> </Div> </Div> </Form>

Attribute	Value	Req?
required	(doesn’t need a value)	√
data-validation-required-message	(your failure message)

当然这里只是简单的介绍到了这个jquery表单验证插件的最基础的功能了，大家可以深入的去研究一下。