Bootstrap the use of validation controls

Front-end HTML code

<formID= "MyForm"Method= "POST"class= "Form-horizontal"Action= "/task/test">                    <Divclass= "Modal-body">                                              <Divclass= "Form-group">                            <labelclass= "Col-lg-3 Control-label">Task Name</label>                            <Divclass= "Col-lg-5">                                <inputtype= "text"class= "Form-control"name= "Takename"ID= "Takename" />                            </Div>                        </Div>                        <Divclass= "Form-group">                            <labelclass= "Col-lg-3 Control-label">Assembly name</label>                            <Divclass= "Col-lg-5">                                <inputtype= "text"class= "Form-control"name= "DllName"ID= "DllName" />                            </Div>                        </Div>                        <Divclass= "Form-group">                            <labelclass= "Col-lg-3 Control-label">Class name</label>                            <Divclass= "Col-lg-5">                                <inputtype= "text"class= "Form-control"name= "MethodName"ID= "MethodName" />                            </Div>                        </Div>                        <Divclass= "Form-group">                            <labelclass= "Col-lg-3 Control-label">Cron expression</label>                            <Divclass= "Col-lg-5">                                <inputtype= "text"class= "Form-control"name= "Cron"ID= "Cron" />                            </Div>                        </Div>                        <Divclass= "Form-group">                            <labelclass= "Col-lg-3 Control-label">Expression description</label>                            <Divclass= "Col-lg-5">                                <inputtype= "text"class= "Form-control"name= "Cronremark"ID= "Cronremark" />                            </Div>                        </Div>                        <Divclass= "Form-group">                            <Divclass= "Col-lg-4 col-sm-4 col-xs-4">                                <Divclass= "checkbox">                                    <label>                                        <inputtype= "checkbox"class= "Colored-success"checked= "Checked"ID= "Enabled">                                        <spanclass= "text">Enable</span>                                    </label>                                </Div>                            </Div>                        </Div>                        </Div>                    <Divclass= "Modal-footer">                        <Buttontype= "button"class= "Btn Btn-default"Data-dismiss= "Modal">Close</Button>                        <Buttontype= "Submit"class= "Btn btn-primary">Submit</Button>                    </Div>                </form>

View Code

Js

<script>$ (document). Ready (function () {            $("#myForm"). Bootstrapvalidator ({message:' This value was not valid ', Feedbackicons: {valid:' Glyphicon Glyphicon-ok ', Invalid:' Glyphicon glyphicon-remove ', validating:' Glyphicon Glyphicon-refresh '}, Fields: {takename: {validators: { Notempty: {message:' Task name cannot be empty '}}} , DllName: { Validators: {notempty: {message:' assembly name cannot be null '                            },                            //Remote: {//ajax authentication. Server result:{"Valid", True or false} sends the current input name value to the service and obtains a JSON data. The example is correct: {"valid", true}                            //URL: '/task/test3 ',//verify address                            //message: ' User already exists ',//Prompt message                            //delay:3000,                            //type: ' POST ',//Request method                                                            ///** Custom Commit data, default commit current input value                            //* Data:function (validator) {                            //return {                            //Password: $ (' [name= ' passwordnameattributeinyourform '] '). Val (),                            //whatever: $ (' [name= ' whatevernameattributeinyourform '] '). Val ()                            //          };                            //       }                            //     */                            //},}}, MethodName: {validators: { Notempty: {message:' Class name cannot be null '}}}, cron: { Validators: {notempty: {message:' Cron expression cannot be empty '}}}, Submithan Dler:function(validator, form, Submitbutton) {varTaskdata = {}; Taskdata.taskname= $ (' #takeName '). Val (); Taskdata.dllpath= $ (' #dllName '). Val (); Taskdata.methodname= $ (' #methodName '). Val (); Taskdata.cronexpression= $ (' #cron '). Val (); Taskdata.remark= $ (' #cronRemark '). Val (); Taskdata.enabled= $ (' #enabled '). Is (': Checked ')); $.ajax ({type:"POST", URL:"/task/addtask", Data:taskdata, success:function(data) {alert (data); $(' #myForm '). Data (' Bootstrapvalidator '). Resetform (true);                }                    }); }            })        })    </script>

View Code

The method is submitted for Ajax, and the commit event is written in Submithandler

Bootstrap the use of validation controls