开发者

jQuery Validate - resetForm() Not Behaving as Expected

开发者 https://www.devze.com 2022-12-29 15:37 出处:网络
Site in question is http://epraxadev.com/kw/palisade开发者_运维问答-palms/ \"Click here for brochure\" and \"Learn More about Palisade Palms\" both bring up a lightbox with the same HTML form to be f

Site in question is http://epraxadev.com/kw/palisade开发者_运维问答-palms/

"Click here for brochure" and "Learn More about Palisade Palms" both bring up a lightbox with the same HTML form to be filled out...the "learn more..." link also changes some of the HTML in the form (the value for a hidden form field, and the fields required).

I'm using Colorbox for the lightbox, and for its onClosed event, I have this to reset the form:

onClosed: function() {
        $('#brochure-form label em').remove();
        $('#brochure-form').data('validator').resetForm();
    }

Now here's the problem:

  • User tries to submit the "brochure" form, but it fails validation. User closes the lightbox.
  • User opens up the "Learn more" lightbox, and tries to submit the form...now, instead of using the correct validation rules (only requiring e-mail and referrer), it requires all fields to be filled out (as is the case with the "Brochure Form")

Is there something that I can add to the onClosed function, to clean up all the validation rules?

Thanks guys!


I fixed it by manually adding & removing the "required" class to desired inputs during the onComplete and onClosed colorbox events, respectively.

Before, I was adding the required input rules with

$('#brochure-form').validate({
            rules: {
                first_name: "required",
                last_name:  "required",
                email: "required",
                phone: "required",
                address: "required",
                city: "required",
                state: "required",
                zip: "required",
                referrer: "required"
            }
        }); 

And those rules weren't properly cleaned out with the resetForm() function.

You can see the working code at http://epraxadev.com/kw/palisade-palms/

You can see the old, non-working version at http://epraxadev.com/kw/palisade-palms/test.html

0

精彩评论

暂无评论...
验证码 换一张
取 消