v0.5.3 is released on 2014.11.05!

notEmpty validator

Return true if the value contains only digits

Options

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

When setting options via HTML attributes, remember to enable the validator by setting data-bv-notempty="true".
You don't need to do that when using HTML 5 required attribute.

Using with select element

If you want a select element to be required, you have to set value="" for the option which is treated as empty one:

<select name="gender">
    <option value="">Select the gender</option>
    <option value="male">Male</option>
    <option value="female">Female</option>
    <option value="other">Other</option>
</select>

Using with WYSIWYG editor

Most of WYSIWYG (What You See Is What You Get) editors generate some HTML tags for an empty string. So, basically, you can't use notEmpty validator to validate a text area which uses a WYSIWYG editor.

Instead, use the callback validator to get the raw HTML string, and check if it's the default value generated by the editor, then it's empty field.

Looking at some examples below will give you the idea:

Examples

Basic example

In the following form, user is asked to enter the full name.

<form id="notEmptyForm" class="form-horizontal">
    <div class="form-group">
        <label class="col-sm-3 control-label">Full name</label>
        <div class="col-sm-4">
            <input type="text" class="form-control" name="fullName" />
        </div>
    </div>
</form>

$(document).ready(function() {
    $('#notEmptyForm').bootstrapValidator({
        feedbackIcons: {
            valid: 'glyphicon glyphicon-ok',
            invalid: 'glyphicon glyphicon-remove',
            validating: 'glyphicon glyphicon-refresh'
        },
        fields: {
            fullName: {
                validators: {
                    notEmpty: {
                        message: 'The full name is required'
                    }
                }
            }
        }
    });
});

<form id="notEmptyForm" 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-3 control-label">Full name</label>
        <div class="col-sm-4">
            <input type="text" class="form-control" name="fullName"
                data-bv-notempty="true"
                data-bv-notempty-message="The full name is required" />
        </div>
    </div>
</form>

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

HTML 5 example

Below is an example of using HTML 5 required attribute to enable the notEmpty validator.

<form id="signInForm" 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-3 control-label">Username</label>
        <div class="col-sm-4">
            <input type="text" class="form-control" name="username"
                required
                data-bv-notempty-message="The username is required" />
        </div>
    </div>

    <div class="form-group">
        <label class="col-sm-3 control-label">Password</label>
        <div class="col-sm-4">
            <input type="password" class="form-control" name="password"
                required
                data-bv-notempty-message="The password is required" />
        </div>
    </div>

    <div class="form-group">
        <div class="col-sm-6 col-sm-offset-3">
            <button type="submit" class="btn btn-default">Sign in</button>
        </div>
    </div>
</form>

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

Related validators

The following validators might be useful to you:

stringLength