Custom Error messages for Jquery validation plugin

We found a very good plugin for jquery validation at position absolute. We enjoyed the plugin and met most of our requirements but it lacked to show customized error message for a field. It uses generic messages for each form field so we done some modification in the plugin to meet our requirements. With modification, plugin is allowed to display custom message for a form field.

We override buildprompt function from the validationengine and added functionality to pick the customized error message.

var buildPrompt = $.validationEngine.buildPrompt;
$.validationEngine.buildPrompt = function(caller, promptText, type, ajaxed) {
  // Get the rules to map the message for a method
  var rulesRegExp = /[(.*)]/;
  var getRules = rulesRegExp.exec($(caller).attr('class'));
  var str = getRules[1];
  var pattern = /[|,|]/;
  var rules = str.split(pattern);
  //Check if title attribute present in the element
  //otherwise we shall use default error message
  if ($(caller).attr('title')) {
    var getMessages = rulesRegExp.exec($(caller).attr('title'));
    var str = getMessages[1];
    var pattern = /[|,|]/;
    var messages = str.split(pattern);

    var j = 0;
    newPrompt = "";
    for ( var i = 0; i < rules.length; i++) {
     rules = $.validationEngine.settings.allrules[rules[i]]
      if (rules) {
        if (promptText.indexOf(rules.alertText) != -1) {

          newPrompt += "

” + messages[j] + ” “; } j++; } } promptText = newPrompt; } buildPrompt(caller, promptText, type, ajaxed); }

So in the plugin, we have added error messages in the ‘title’ attribute and this gives the flexibility to customize the error message for different field. So here is the example where custom error message can be added:

Please feel free to add your comments/questions or Suggestions

Leave a Comment

Scroll to Top