Response title
This is preview!
Form DOM
in Getting Started
•
12 years ago
I have a page with a form that submits to a page and I want to replace on load the existing code with an AJAX call (I don't want to touch the original form or functionality for legacy/compatability reasons).
My form is simple (but has an unknown number of fields)
- <form action="processpage.asp" name="myForm" method="post" onsubmit="return validate(this)">
-
- <input type="text" name="field1" value="" />
- <input type="text" name="field2" value="" />
- <input type="text" name="field3" value="" />
- ...lots more fields
- </form>
My validation function is:
- function validate(f) {
- var allValid = true;
- for (var i=1;i<=f.elements.length;i++) {
- //Validate fields
- }
- return allValid;
- }
And this works fine, however I want to now take all the inputs and pass them to an equivalent page via ajax without sending the user anywhere - including passing it through the original validation function.
I started with the following but am a bit lost as to how to re-use my validate function without either duplicating or copying it.
- $(window).load(function() {
- $(':input[name$="submitButton"]').each(function() {
- var $form = $(this).parents("form");
- // I now have my form in jQuery, but how do I do pass in the same [this]
- // HTMLFormElement thats needed for the validate function?
- }); });
1