BootstrapValidator bootstrap-select verifies the unavailable solution. validator verifies the select

BootstrapValidator bootstrap-select verifies the unavailable solution. validator verifies the select

Three steps are required to resolve the unavailability of bootStrapValidator bootStrap-select verification:

Ideas:Assign the selected value from the multiple selection drop-down box to a hidden input component and verify the input component (bootstrap-validator hidden by default, disabled components are not verified, can be changed through the excluded attribute), the specific steps are as follows:

1. Form Verification initialization (js)

$ ('# MyModalForm '). bootstrapValidator ({message: 'This value is not valid', excluded: [': disabled'], // [': disabled', ': Den den', ': not (: visible) '] // sets the hidden component to verify that feedbackIcons: {valid: 'glyphicon glyphicon-OK', invalid: 'glyphicon glyphicon-delete', validating: 'glyphicon glyphicon-refresh'}, fields: {roleid: {message: 'Role invalid ', validators: {notEmpty: {message: 'Role cannot be blank '}}}}})

2. bootStrap-select component configuration (jsp page)

<Input type = "hidden" class = "form-control" id = "roleid" name = "roleid"> <select class = "selectpicker form-control" multiple data-width = "60%" id = "roleidForSelect" title = "--- select ---"> </select>

3. assign a value to the corresponding input after selecting multiple drop-down lists.

$ ('# Roleidforselect '). on ('ddden. bs. select ', function (e) {// This method is registered to the $ (function () {}) function var tmpSelected = $ (' # roleidforselect '). val (); if (tmpSelected! = Null) {$ ('# roleid '). val (tmpSelected);} else {$ ('# roleid '). val ("") ;}// because the input is hidden, some bugs may occur during verification. Here, you can manually verify the hidden input component $ ('# myModalForm '). data ('bootstrapvalidator '). updateStatus ('roleid', 'not _ validated '). validateField ('roleid ');});

If you want to study in depth, you can click here to learn and attach three special topics:

Bootstrap tutorial

Bootstrap tutorial

Bootstrap Table tutorial

Bootstrap plugin usage tutorial

The above is all the content of this article. I hope it will be helpful for your learning and support for helping customers.