Sunday, May 20, 2018

Bootstrap Validator - Submit button remain disabled even when form is valid



If you work with Boostrap Validator (http://1000hz.github.io/bootstrap-validator/), you may experience an issue when your entire form is valid, however, the submit button remains disabled. Furthermore, if you check the form feedback div via console, e.g.


console.log("danger: " + $('#submit-form').find('.has-danger').length);
console.log("error: " + $('#submit-form').find('.has-error').length);
console.log("success: " + $('#submit-form').find('.has-success').length);


all danger, error and success class could not be found.

The reason: You have disabled but required fields in your form.

To workaround it, you could set

data-validate="false"


in your field and only enable validation as required, e.g


create.click(function(event){
//enable the field
document.getElementById("name").disabled = false;
//enable data validation
$("#name").attr('data-validate', true);
// Tell validator there's a change - update and validate
form.validator('update').validator('validate');
// print data validation attribute
console.log( $("#name").attr('data-validate') );
});

No comments:

Post a Comment

SSH - No supported authentication methods available

When you setup SSH public key authentication, you may be hit by an error saying If you are sure that your authorized_keys file at the...