If you know the form name, you have most of what you need. Using
jQuery's selectors, get a reference to the form:
$("form[name='myform']);
Then from there find each of the child form elements (luckily, most form
elements are input boxes:
$("form[name='myform'] input);
Repeat the above for the other form tags in your form - select,
textarea, etc.
Then apply your event handler:
$("form[name='myform'] input).blur(function () {
$.ajax({url: 'mypage.php', . . .});
});
Repeat this for each selector type you may need (selects, text areas,
etc.) - but the inner code will be the same, so you should probably
create a function that does the submission.
The $.ajax call really depends on your needs. You'll need the Success
parameter set so you can populate the DIV with the results (or use a
$.post() if you want to short cut a little). Serializing your data for
submission, well, that's what pulled me into this thread. I want to see
how others are doing it.
For myself, I create a string variable, and manually create the string
based on the form values. Maybe using the .serialize() or
.serializeArray() methods (http://docs.jquery.com/Ajax - bottom of list)
would be a better option.
There ARE plugins to help with form management/submission. The Form
plugin has helped me some. But, it's really just a shortcut to doing it
manually - under the hood I *think* it's just doing the same type of
thing as what I posted above...
Any better ways to do this? I'm not sure I'm steering you straight
here, but am relatively confident my suggestions will work. The
question is if my method is more work than I should be doing.. :)
Shawn
mo2g wrote:
> I have a web page with two forms on it. It originally used Prototype
> and I would like to convert it to jQuery.
>
> The main form has text, checkboxes, radio buttons, etc.
>
> I want to watch the form and if any form element changes I want to
> serialize the entire form and post it to a URL, receive the result and
> show it in a DIV.
>
> Basically I will be using this form to return a "live" search result
> total so that the user can see how many results will be returned with
> certain search form choices.
>
> I have viewed many different tutorials both with and without plugins.
> I am posting here in hopes that the experts on this forum can point me
> in the right direction. Should I use plugins and if so which ones?
>
> Here are a couple of my requirements:
>
> 1. I need to be able to reference only the one form. There may be
> multiple forms on the page.
> 2. I need to watch all the elements for change which includes
> checkboxes and radiobuttons.
> 3. I would like the page to load as quickly as possible.
> 4. When i serialize the form to submit it for the live results, I need
> all the form elements to post correctly including the checkboxes.
>
> Thanks in advance.
>
