different validator
Return true if the input value is different with given field's value
Options
* — Required option
| Option | HTML attribute | Type | Description |
|---|---|---|---|
field* |
data-fv-different-field |
String | The name of field that will be used to compare with current
one. You also can indicate many fields which names are separated by a comma. |
message |
data-fv-different-message |
String | The error message |
When setting options via HTML attributes, remember to
enable the validator by setting data-fv-different="true".
The message and other options can be updated on the
fly via the updateMessage() and updateOption() methods
Take a look at the Asking fields to be unique example if
you want to compare more than two fields at the same time
From v0.6.0, you don't need to set different validator for all fields which you want them to be different to each other. For example, instead of using different validator for all fields as following
$('#differentForm').formValidation({
framework: 'bootstrap',
fields: {
username: {
validators: {
different: {
field: 'password',
message: 'The username and password cannot be the same as each other'
}
}
},
password: {
validators: {
different: {
field: 'username',
message: 'The username and password cannot be the same as each other'
}
}
}
}
});just set it to one of fields:
$('#differentForm').formValidation({
framework: 'bootstrap',
fields: {
password: {
validators: {
different: {
field: 'username',
message: 'The username and password cannot be the same as each other'
}
}
}
}
});The plugin then will update the message, icon, status of fields properly when you change value any fields.
Example
The registration form below doesn't allow the username and password to be the same:
<form id="differentForm" class="form-horizontal">
<div class="form-group">
<label class="col-xs-3 control-label">Username</label>
<div class="col-xs-5">
<input type="text" class="form-control" name="username" />
</div>
</div>
<div class="form-group">
<label class="col-xs-3 control-label">Password</label>
<div class="col-xs-5">
<input type="password" class="form-control" name="password" />
</div>
</div>
</form>
<script>
$(document).ready(function() {
$('#differentForm').formValidation({
framework: 'bootstrap',
icon: {
valid: 'glyphicon glyphicon-ok',
invalid: 'glyphicon glyphicon-remove',
validating: 'glyphicon glyphicon-refresh'
},
fields: {
password: {
validators: {
different: {
field: 'username',
message: 'The username and password cannot be the same as each other'
}
}
}
}
});
});
</script><form id="differentForm" class="form-horizontal"
data-fv-framework="bootstrap"
data-fv-icon-valid="glyphicon glyphicon-ok"
data-fv-icon-invalid="glyphicon glyphicon-remove"
data-fv-icon-validating="glyphicon glyphicon-refresh">
<div class="form-group">
<label class="col-xs-3 control-label">Username</label>
<div class="col-xs-5">
<input type="text" class="form-control" name="username" />
</div>
</div>
<div class="form-group">
<label class="col-xs-3 control-label">Password</label>
<div class="col-xs-5">
<input type="password" class="form-control" name="password"
data-fv-different="true"
data-fv-different-field="username"
data-fv-different-message="The username and password cannot be the same as each other" />
</div>
</div>
</form>
<script>
$(document).ready(function() {
$('#differentForm').formValidation();
});
</script>Related validators
The following validators might be useful to you: