Skip to content

jQuery validationEngine: Extended jQuery form validations

May 8, 2011

This post has been moved to

http://blog.navayan.com/jquery-validationengine-extended-jquery-form-validations/

Advertisements
13 Comments
  1. Johnny permalink

    Hi
    It’s great but not working on IE9……….
    Have any idea ?

    • @Johnny – The validation plugin works just fine in IE9 as well. Did you cleared your browser’s cache and/or history? Also try Ctrl + F5 to reload javascripts. That should work without any issue.

      • Johnny permalink

        Sorry , I am not acturally install IE9 . I just use IETEST to test validation plugin .,
        IE8 works fine but IE9 not works in IETEST .
        Is there IETEST problem ?

        Thanks

      • @Johnny – It might be the problem with IETEST. I have tested on IE9 standard version from Microsoft itself. Also it works without any issue in different modes ie. IE7, IE8, IE9. So try on standard version.

  2. Am in love with your validation Engine. I have the latest version. Working cool but … there is an issue , have been trying to fix it but
    quite difficult.

    I want to use validation engine on a form inside an overlay Modalbox called Boxy… I love boxy bcos its cool and nice….. but your validation Engine does not really work inside BOXY Modal window….
    I manage to make it work but it doesn’t validate properly.

    When i open a fresh page and open the Boxy Modal box containing form, it works but when i close the boxy modal box and re-open it the validation no longer works

    … only works if i refresh page and reopen modal box, BOXY

  3. This is great. How would I break up a large form into a tabbed interface? I am using jQuery UI but whatever works. Is it as simple as using multiple forms?

    • @shaggy – You can use the same plugin on multiple forms. You will only need to provide the form id for validation. For example:

      $(‘#form_contact’).each( function() {
      $(this).validationEngine();
      });
      $(‘#form_personal’).each( function() {
      $(this).validationEngine();
      });
      $(‘#form_survey’).each( function() {
      $(this).validationEngine();
      });

      I have used it seven times with tabbed interface in my project http://www.navayan.com for user’s edit profile.

      Please see my Cookie Based jQuery Tabs plugin for this. And it will not download the javascript for each tab so go ahead by using tabbed interface:

  4. phpnewbie permalink

    Position Absolute’s jquery field validation is passed when user didn’t yet enter information if the field input is watermarked by Watermark input plugin.

    Position Absolute : http://www.position-absolute.com/articles/jquery-form-validator-because-form-validation-is-a-mess/

    Watermark Input : http://digitalbush.com/projects/watermark-input-plugin/

    Is it possible to change this behaviour?

    For example,

    Name : [ Enter your Username? ]

    If user didn’t enter anything, it passes thru where as normal behaviour should be, it should block it.

    • @phpnewbie – I will check and post a comment

    • @phpnewbie – I don’t think you need watermark input plugin. You can do that behavior using jQuery’s ‘blur’ and ‘focus’ events.

      Try following functions:

      // GLOBAL FOCUS/BLUR
      function isFocus(field, val){
      if(field.value == val){field.value = '';}
      }
      function isBlur(field, val){
      if(field.value == ''){field.value = val;}
      }

      $('#input_field_id').focus(function(){isFocus(this, 'First Name');});
      $('#input_field_id').blur(function(){isBlur(this, 'First Name');});

      Write CSS for font colors. And some basic validation rules to check the default focus/blur text in input field.
      Is that what you were looking for?

  5. Anna Salomon permalink

    Nice write up, I was just wondering, would you happen to know how I can make the inputs have a red border when the validation fails and then disappear when it passes. I have this so far which puts the border fine, but can’t figure out how to remove it when the fields are correct. Thanks

    $(“#myForm”).bind(“jqv.form.result”, function(event , errorFound){
    if(errorFound)$(“*[class*=’validate’], select[class*=’validate’]”).addClass(“redBd”);
    $(“input[class*=’validate’], select[class*=’validate’]”).parentsUntil().addClass(“validation-error”);
    })

  6. Great work. I’ve just got one question. I have multiple buttons on my page and only want to validation to fire off on one of them. Is there a way to disable it on certain buttons?

    • @akismet – yes, it is possible. The validation engine looks for the ID of the form. You can have multiple buttons/links there on the same form. You will just need to change-and-revert the ID of form which you ‘want-to/not-want-to’ validate.
      I hope this answers your question. If not then please share a link of your form page.

Comments are closed.

%d bloggers like this: