Brian J Brian J - 1 year ago 50
Javascript Question

How to call a validation callback function within formValidation plugin?

I'm using the formValidation plugin from in a HTML5 form to perform validation on the form inputs.

The standard checks such as

work as expected on the input. But now I have a case where the input needs to validated against a list. I've already coded the function
to do that but haven't figured out how to call it from within the formValidation plugin.

This is the example I've followed in order to try an implement the callback function. But during run-time the call back function doesn't fire when filling out the
input value.

I've set an alert within the callback that does trigger every time I change input value. I also verified that
works by triggering it on the
event and it does work.

It seems that the way I'm returning the bool validation result isn't correct.


How can I call a callback function within formValidation plugin?

Code: (gist)

EM input element -

<input id="EscID" name="EM" maxlength="10" type="text" data-error="EM already exists or none supplied" placeholder="(If Applicable)" class="form-control">

Script -


//List EM input is validated against
var escHistoryList = @Html.Raw(Json.Encode(Model.EscHistory));

$(document).ready(function () {

var $createForm = $('#createForm');

//Validate the required input fields to prevent submit if not
//valid input.
framework: 'bootstrap',
icon: {
valid: 'glyphicon glyphicon-ok',
invalid: 'glyphicon glyphicon-remove',
validating: 'glyphicon glyphicon-refresh'
Application: {
validators: {
notEmpty: {
message: 'The Application name field is required'
EM: {
validators: {
callback: {
message: 'A record with this EPRID already exists!',
callback: function (value, validator, $field) {
// Determine if the input EPRID already exists
var emidVal = $('#EscalationID').val();
var isEMIDMatch = false;

isEMIDMatch = checkEMIDExists(emidVal);

return true;


//Determineif input EMID exists in list
function checkEMIDExists(emidVal){

var isMatch = false;
for(var i=0;i<escHistoryList.length;i++){
if(escHistoryList[i]["EM"].indexOf(emidVal) > -1){
isMatch = true;


return isMatch;

});//end $(document).ready


Answer Source

Your callback method should also return false in case the validation fails. A null return value is ignored.

Change your callback return statement to:

return isEMIDMatch;

or perhaps even more succinctly albeit less readable:

return checkEMIDExists(emidVal);