JQuery validation plugin being ignored

I am using this (and a few other plugins) http://docs.jquery.com/Plugins/Validation to validate this form

http://lombardiassoc.myclient-review.com/test.php

Click, New (to empty the form) and then Submit and the validation code is being ignored. This was working and at some point it broke. I tried disabling all the non-necessary javascript and the problem is still happening. I need a second set of eyes to help me troubleshoot this. I am sure its something simple, I am just over looking it.

Please help
Michael SoleDirector of SupportAsked:
Who is Participating?

[Product update] Infrastructure Analysis Tool is now available with Business Accounts.Learn More

x
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

Kyle HamiltonData ScientistCommented:
seems to be working in CHROME and FF (I didn't look on IE). What browser are you using?

I use this script too, though slightly differently. here's mine if it helps:
(Obviously you would need to customise to your needs)

 
var validator = $("#ContactForm").submit(function() {
			
		}).validate({
			rules: {
                                email: {
				required: true,
				email: true
                                },
				FirstName: "required",
                                LastName: "required",
                                phone: "required",
                                notes: "required",
                                imgverify: "required"
			},
                        messages: {
                            email: {
				required: "Please enter your email address."
                            },
                            FirstName: {
                                required: "Please enter your first name."
                            },
                            LastName: {
                                required: "Please enter your last name."
                            },
                            phone: {
                                required: "Please enter your phone number."
                            },
                            notes: {
                                required: "Please enter a message."
                            },
                            imgverify: {
                                required: "Please enter the image characters."
                            }
                        },
			errorPlacement: function(label, element) {
				// position error label after generated textarea
				if (element.is("textarea, input")) {
					label.insertAfter(element.next());
				}else{
                                    label.insertAfter(element);
                                }
                                
			}
		});

Open in new window

0
Michael SoleDirector of SupportAuthor Commented:
Yeah normally this script just works. However I had setup a test version of the form and forgot to make a change so it went to the login form and yes that is working. I typically develop in Chrome.

http://lombardiassoc.myclient-review.com/test.php

Please try this one.

I prefer to use the class method of identifying validation rules as it is quite a bit simpler to track, especially on forms with lots of fields.
0
Kyle HamiltonData ScientistCommented:

You have a AJAX request on line 61. Comment that out temporarily and see if that fixes it. I think it could have something to do with the form repopulating on submit... Not sure, give it a shot...
0
Big Business Goals? Which KPIs Will Help You

The most successful MSPs rely on metrics – known as key performance indicators (KPIs) – for making informed decisions that help their businesses thrive, rather than just survive. This eBook provides an overview of the most important KPIs used by top MSPs.

Michael SoleDirector of SupportAuthor Commented:
I did try commenting all of the javascript except the form validation and the problem still occurs.

I have removed the ajax completely.
0
Kyle HamiltonData ScientistCommented:
It's the metadata functionality which is not working. It doesn't even work on jQuery's own site.

I tried it with the technique I use and things work. For reference, I changed your first field to "Email" just to test it:
http://candpgeneration.com/EE/EE-validate2.php

In this example, I basically copied the code from jQuery's site. You can see that the validation doesn't work. (I commented out my own code, so if you uncomment it you'll see it does work.):
http://candpgeneration.com/EE/EE-validate4.php

Anyway, it's totally up to you if you want ot fight with the metadata, but it seems to me to be a flawed technique..

Cheers.
0

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
Michael SoleDirector of SupportAuthor Commented:
kozaiwaniec, thank you so much. You've given me a narrower field to troubleshoot.

The thing is, it did work at some point but I added much since then, I suspect I might of changed the JQuery version and that the metadata plugin might not be compatible.

Regardless, I believe I have things I might try now.

Happy New Year to you!
0
Kyle HamiltonData ScientistCommented:
Cool. Let me know if you figure out what was wrong.

Happy New Year to you too!
0
Michael SoleDirector of SupportAuthor Commented:
Hey I know I closed the question but, I re-wrote the validation to not use the class/metadata method.

However I have one last odd problem, the last field causes the validation to be ignored and I can't see why that would be. If I remove it

claimantAltPhone: {
                              phoneUS:true
                        }

It works. Any thoughts?
0
Michael SoleDirector of SupportAuthor Commented:
Nevermind, I accomplished what I wanted by using the mask plugin, however it is a strange bug.

Again, re-writing to use the not class method is how I went about fixing the problem.

Thanks again!
0
Kyle HamiltonData ScientistCommented:
It might have something to do with it not being required. Try it with required:true to test this theory...
0
Kyle HamiltonData ScientistCommented:
OR,

required:false

just a thought..
0
Michael SoleDirector of SupportAuthor Commented:
I did try that, it didn't work. However required:true did.
0
Kyle HamiltonData ScientistCommented:
Since there is only one condition, you could try writing it this way:

claimantAltPhone: "phoneUS"

Let me know if that works.
0
Michael SoleDirector of SupportAuthor Commented:
Ah the quotes!

Thats what I was missing, forest through the trees :)
0
Kyle HamiltonData ScientistCommented:
:)
0
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
JavaScript

From novice to tech pro — start learning today.