Developing

Edit on Github

This page helps you develop new validator as well as build the plugin.

A validator has to follow the syntax:

(function($) {
    $.fn.bootstrapValidator.validators.<validatorName> = {
        /**
         * @param {BootstrapValidator} validator The validator plugin instance
         * @param {jQuery} $field The jQuery object represents the field element
         * @param {Object} options The validator options
         * @returns {boolean}
         */
        validate: function(validator, $field, options) {
            // You can get the field value
            // var value = $field.val();
            //
            // Perform validating
            // ...
            //
            // return true if the field value is valid
            // otherwise return false
        }
    };
}(window.jQuery));

<validatorName> is the validator name. Since the validators are distinct by the names, <validatorName> has to be different with built-in validators.

To apply the validator to particular field:

$(form).bootstrapValidator({
    fields: {
        <fieldName>: {
            // Replace <validatorName> with the name of validator
            // <validatorOptions> will be passed as third parameter of the
            // validate(validator, $field, options) method
            <validatorName>: <validatorOptions>
        }
    }
});

For Rails, the input field is constructed from model name and field name. For example, user have email as field, when form helper render view, the input field name will be 'user[email]'. The syntax for these is somewhat different as shown below:

$(form).bootstrapValidator({
    fields: {
        'user[email]': {
            <validatorName>: <validatorOptions>
        }
    }
});

To see how built-in validators are developed, you can look at their sources located at the src/js/validator directory.

Building

BootstrapValidator uses grunt to simplify building process.

From the BootstrapValidator root directory, install dependencies:

$ npm install

Then, uses grunt to build:

$ grunt

If you want grunt to generate scripts whenever the original scripts (located in src) change, use the following command:

$ grunt watch

The generated scripts (including source and compressed versions) are placed inside the dist directory.

Contributing

If you develop new validator which might be useful for other one, please contribute it to the project.

It can be done via 3 steps:

  • 1 — Fork the project
  • 2 — Develop new validator, suggest new feature or fix a bug
  • 3 — Pull a new request

All pull requests are welcome .

Comments

If you want to report a bug, please submit the issue on Github. Do NOT post the issue here.

For a general question or feedback, use the form below.