v0.5.3 is released on 2014.11.05!

integer validator

Validate an integer number. Accept both positive and negative number

Options

Option	HTML attribute	Type	Description
`message`	`data-bv-integer-message`	String	The error message

When setting options via HTML attributes, remember to enable the validator by setting data-bv-integer="true".
You don't need to do that when
i) using HTML 5 type="number" attribute,
ii) and the step attribute is not specified, or its value is an integer

Examples

Basic example

<form id="integerForm" class="form-horizontal">
    <div class="form-group">
        <label class="col-sm-4 control-label">Type an integer number</label>
        <div class="col-sm-3">
            <input type="text" class="form-control" name="number" />
        </div>
    </div>
</form>

$(document).ready(function() {
    $('#integerForm').bootstrapValidator({
        feedbackIcons: {
            valid: 'glyphicon glyphicon-ok',
            invalid: 'glyphicon glyphicon-remove',
            validating: 'glyphicon glyphicon-refresh'
        },
        fields: {
            number: {
                validators: {
                    integer: {
                        message: 'The value is not an integer'
                    }
                }
            }
        }
    });
});

<form id="integerForm" class="form-horizontal"
    data-bv-feedbackicons-valid="glyphicon glyphicon-ok"
    data-bv-feedbackicons-invalid="glyphicon glyphicon-remove"
    data-bv-feedbackicons-validating="glyphicon glyphicon-refresh">

    <div class="form-group">
        <label class="col-sm-4 control-label">Type an integer number</label>
        <div class="col-sm-3">
            <input type="text" class="form-control" name="number"
                data-bv-integer="true"
                data-bv-integer-message="The value is not an integer" />
        </div>
    </div>
</form>

<script>
$(document).ready(function() {
    $('#integerForm').bootstrapValidator();
});
</script>

HTML 5 example

You can use HTML 5 type="number" attribute to enable the integer validator.

<style type="text/css">
/* Place the HTML 5 spinner at the default position */
#html5Form .inputContainer .form-control {
    padding-right: 10px;
}
/* Adjust feedback icon position */
#html5Form .inputContainer .form-control-feedback {
    right: -15px;
}
</style>

<form id="html5Form" class="form-horizontal"
    data-bv-feedbackicons-valid="glyphicon glyphicon-ok"
    data-bv-feedbackicons-invalid="glyphicon glyphicon-remove"
    data-bv-feedbackicons-validating="glyphicon glyphicon-refresh">

    <div class="form-group">
        <label class="col-md-4 control-label">Type an integer number</label>
        <div class="col-md-3 inputContainer">
            <input class="form-control" name="number"
                type="number"
                data-bv-integer-message="The value is not an integer" />
        </div>
    </div>
</form>

$(document).ready(function() {
    $('#html5Form').bootstrapValidator();
});

Related validators

The following validators might be useful to you: