victorjonsson / jQuery-Form-Validator

[DISCONTINUED] jQuery plugin that makes it easy to validate user input while keeping your HTML markup clean from javascript code.
972 stars 476 forks source link

Relocating specific error message. #212

Closed muyaszed closed 9 years ago

muyaszed commented 9 years ago

Hi I am trying to relocate an input error message inside another div. I would like to relocate on this error message. So I am trying to use jquery for this.

Below is my html

<div class="medium-2 column end">
<input type="text" id="captcha" name="captcha" data-validation="spamcheck" data-validation-captcha="<?=( $_SESSION['captcha'][0] + $_SESSION['captcha'][1] )?>">
</div>
<div id="captcha-error" class="medium-12 column"></div>

when validate and have error I would like to move the span inside #capture-error div. Below is my jquery

$('#captcha').on('validation', function(evt, isValid) {
    if( !isValid ) {
      $('#captcha').next().clone().appendTo("#captcha-error");
      $('#captcha').next().hide();
    }
  });

Somehow it does not work, probably someone could help. or maybe is there any other solution for me to relocate only this error message. Thanks in advance

victorjonsson commented 9 years ago

There's a thought-out way to relocate the error message and I'm sorry that it's not mentioned in the documentation.

When the error message gets displayed the validator will look for an element that has id [INPUT-NAME]_err_msg. So in your case when the input is named captchayou should set the id to captcha_err_msg. Here's a working example http://jsbin.com/xuzexapeki/1/edit