Using JQuery to Update Form Fields before passing to PayPal - php

Question

I have spent the day studying up on jquery because I think it will allow me to do this. I have a paypal form and I want the "onClick" button to send this field to my sql table
<input type="hidden" name="amount" id="amount" value="0.05">
Meanwhile my PayPal button is doing this:
<input class="btn btn-primary" onClick="send()" type="submit" value="Subscribe">
How can I pass this value to my process_plan.php? So far I have this but it's hanging and not working.
function send() {
var id = $('#amount').val();
var result;
$.ajax({
type: "POST",
url: "process_plan.php",
data: {
"amount" : amount
},
async: true,
dataType: "html",
success: function(response) {
result = response;
},
error: function(response) {
alert("Oh no! An error occured!");
}
});
return result;
}
I apologize if the code is really wonky - really my first day studying up on Jquery and Ajax.

Answer 1

Don't know if that is the problem, but I think you have a little mistake in your code.
Please try :
...
data: {
amount : "amount"
},
...
In case that amount is a var too, delete the "

Answer 2

Use a tools such as firebug for firefox or fiddler (http://www.fiddler2.com/fiddler2/) to look at the request and response. It will tell you how the communication is going.
That being said it's not hanging. Your send() function is posting a value asynchronously, meaning the function send() will return while the ajax call is being made. You cannot rely on the result to be set by the time the function returns. That is why you have a callback function in the call:
success: function(response) {
result = response;
},
This will run after the call is complete and generally after the originating function has completed. To see it in action change it to:
success: function(response) {
window.alert("Response: " + response);
},
You can then go onto submitting the form, in the success function, by selecting the form and manually call submit:
success: function(response){
$('#form-id').submit();
}
For more information on the quirks of ajax see this msdn: https://developer.mozilla.org/en-US/docs/AJAX
Where is the variable amount defined? I have a feeling you wanted to use id instead:
data: {
"amount" : id
},

Answer 3

I think there is another mistake! You set the variable 'id' to the value of the field, then you send the undefined variable 'amount' in the data of the post. This would fix it:
var amount = $('#amount').val();