Hi Jorn,

Here's an example I just made, and it has the same problem too:

------------ code begins --------------
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://
www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml";>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/jquery.validate.js"></script>
<script type="text/javascript">
  $(function(){
    $("#contact-form").validate({
      debug : true,
      rules: {
        name : "required",
        email : {
          required : true,
          email : true
        },
        comment : "required",
        website : "url"
      },
      messages: {
        name : "Please specify your name",
        email : {
          required : "Please enter your email. Your email will only be
used for contacting purpose.",
          email : "Please enter a valid email address."
        },
        comment : "Please type in your comment."
      },
      wrapper : "div class='validation-wrapper'",
      errorElement : "div",
      errorClass : "validation-error",
      errorPlacement : function(error, element) {
        error.insertAfter(element.parent());
        error.prepend("<div class='custom markup for styling'></
div>");
      }
    });
  });
</script>
<title>Title</title>
</head>
<body>
<form id="contact-form">
    <div class="form-field">
      <label for="name">Name:</label><span class="required">*</span>
      <input type="text" id="name" name="name" />
    </div>
    <div class="form-field">
      <label for="email">Email:</label><span class="required">*</span>
      <input type="text" id="email" name="email" />
    </div>
    <div class="form-field">
      <label for="comment">Comment:</label><span class="required">*</
span>
      <textarea id="comment" name="comment"></textarea>
    </div>
    <div class="form-field">
      <label for="website">Website:</label>
      <input type="text" id="website" name="website" />
    </div>
    <div class="form-field">
      <input type="submit" name="submit" value="Send" />
    </div>
  </form>
</body>
</html>

-------- code ends -----------

What I was trying to do is, to wrap the error with a wrapper, so that
I can add some more CSS styling to it. Also the wrapper must have a
class, but I don't know how to properly insert a class into the
wrapper, so I ended up using wrapper : "div class='validation-
wrapper'" although I know it is not a correct way to do it. Is there
any solution for this?

I have also found another bug in Opera 9.50 . When I tried submitting
the form without filling out the "Comment" field, of course the error
will be displayed. But even after I typed in a comment, the error
doesn't disappear, and I cannot submit the form.

Thanks for your support.

On Jun 16, 6:23 pm, "J�rn Zaefferer" <[EMAIL PROTECTED]>
wrote:
> Could you post a testpage?
>
> J�rn
>
> On Mon, Jun 16, 2008 at 3:11 AM, Cao Le Thang Long
>
> <[EMAIL PROTECTED]> wrote:
>
> > Hi,
>
> > I'm currently using the validation plugin. However I ran into some
> > problems.
>
> > When I use "div" (or even "ul") as a wrapper, if there is a validation
> > error and I correct it, the whole form disappear, in fact the whole
> > "body" element is marked as "display: none".
>
> > I did a search on Google and found out that this has been briefly
> > discussed at 
> > :http://bassistance.de/jquery-plugins/jquery-plugin-validation/#commen...
> > (read the comment of Michiel Thalen) , and Jorn also said that the fix
> > will be included. However I checked the latest CVS and nothing
> > changed.
>
> > As far as I tried, changing:
>
> > toToggle.push( toToggle.parents( this.settings.wrapper ) );
>
> > to:
>
> > toToggle.push( toToggle.parent() );
>
> > fixes this problem. But I am not certain that this change will affect
> > any other behaviors of the plugin.
>
> > I guess this is a pretty annoying bug that should be fixed in the next
> > release.
>
> > Thanks

Reply via email to