I have a form element and that has a normal submit button but I also want to be able to submit an AJAX get request using the values entered in the form but make it to a different address (this is independed of the submit button).
Is there an easy way to do that?
The long version: I have a form with several select elements in it and want to repopulate them (updating them to the new set of valid values) each time the user sets one of them.
This will be easiest if you use a library (Prototype, jQuery, Closure, or any of several others). With the help of such a library, it becomes almost trivially easy to do this.
Prototype example:
$('theFormElementId').request({
onSuccess: function(response) {
// GET was successful
}
});
that uses Prototype's Form#request
, but you could use Ajax.Request
instead and get the form data via Form#serialize
(Form#request
basically just does that for you).
jQuery example:
$.get("yoururl", $('#theFormElementId').serialize(), function(data) {
// The GET was successful
});
That uses jQuery's $.get
and serialize
functions (you could use $.ajax
instead of $.get
for more control/options).
It's totally possible to do this without a library, it's just a lot more work.