Question

I will give a few examples of the form issue I am running into. I have already been chastised for using ‘obstrusive js’ and trying to do a better job as a programmer but it makes it utterly frustrating when the ‘obtrusive js’ works and the unobtrusive does not. The overall goal is give submit() like behavior to something other than an actual form type=submit button, in this case an image link.

EXAMPLE 1

Example Link 1

Theory here would be that on the click of ID “pw_submit”, the form input is disabled (works), the submit function is called which triggers validate. The latter does not happen. Moving on.

EXAMPLE 2 –

See this JS fiddle: http://jsfiddle.net/YkuAk/

Works but with regular html button, not what I want/need

As I mention above, example 2 “works” in the sense validate is called but it does NOT achieve our goal of using a hyperlink, image, etc to initialize the submit() function.

EXAMPLE 3 – “obtrusive JS”

Third example with Obtrusive Javascript
This example works without any issue but as I mention above, have been criticized for using inline js. While in my mind it is NO different than the code in example one, clearly it is.

Any ideas?

Answer 1

the validation plugin binds its own listener to form submit event. In the first fiddle, take the $("#someform").validate(); outside of the click event callback. The way it is now, the plugin is adding another submit listener to the form.

EDIT:

misread the fiddle. The validation plugin doesn’t validate disabled inputs.

If you really want to validate all disabled form fields also, the
relevant line in the plugin is
.not(“:submit, :reset, [disabled]”) to which you can add or remove
functionality.

src: http://forum.jquery.com/topic/jquery-jquery-validate-validating-disabled-inputs