Use validation outside the context of a form

[btantlinger]

jqBootstrapValidation seems to only work inside the context of a form submit. But this does not work well with some use cases. Why can't I validate a single component any time I want? something like:

$('#my-text-field').jqBootstrapValidation('validate');

To have the validation error show for that component?

[ReactiveRaven]

Because it was only supposed to be for forms ;)

Unfortunately, you do need to 'set up' the field first (if you've copy-pasted step 2 from the installation in the docs, your fields should already be set up), but you can do something similar to what you've asked:

var $inputs = $("#my-text-field");
$inputs.jqBootstrapValidation(); // set up; ideally only called on each field once

// triggers the field(s) to show the error-state if something is wrong
$inputs.trigger("change.validation", {submitting: true});

If you want to do something with the error messages but not display them in help-blocks, you can also get them with collectErrors:

var errors = $("...").jqBootstrapValidation("collectErrors");

// {
//   "username": ["...", "..."],
//   "password": ["...", "..."]
// }

I'll mark this as an enhancement request too, it would make sense for it to be easier.

[btantlinger]

Awesome, thanks!

[kenyee]

I'd like to second the enhancement request. E.g., I'm trying to use this w/ Meteor.js and forms aren't really "submitted". You catch the click event on the submit button, then do an ajax call to call a web method, then do a return false to prevent the click from doing the actual submit.
Would be nice if there were some way of saying "validate this form and display errors in help block now". There can also be multiple forms on the page at once, but they're hidden because it's a single page app framework (no browser refresh/reload at all).

[tuxicon]

Yes, this enhancement would be great to have!

[skybondsor]

+1 for adding this feature