Tutorial :Best practice for sending AJAX data via form - retrieving value back


I have a small form where I want the values to be updated on change for my select boxes which can be done with:

$("form#updateclient select").change(function(){ // use one selector for all 3 selects      $.post("inc/process-update.php",{          // data to send          completed: $("select#completed").val(),          hours:     $("select#hours").val(),          update_id: $("#u_id").val(),          who:       $("select#who").val()      }, function(data) {          // do callback stuff with the server response 'data' here      });  });  

But I have a input text field, where a user can enter the amount of hours, when they click out of the box THEN send that AJAX request to a PHP page.

And the #completed field is now a checkbox, does that pass the same was as an input? How would that work with jQuery, so if you check or uncheck send that info and update database

The thing I have been trying to research now is what is the best way to retrieve those values from the server and update them on the page using AJAX. So once i update my dropdown, it will keep that same result.

Any ideas?


And the #completed field is now a checkbox, does that pass the same was as an input?

No. A checkbox's .value (as used by jQuery's val() method) is always the string in the value="..." attribute (defaulting to “on” if omitted), regardless of whether it is ticked or not. To get the effective value of a checkbox you need to look at the ‘.checked’ property. eg.

var v= element.checked? element.value : '';  

Also, you can't use an onchange handler to detect when a checkbox is changed, as IE doesn't fire that event. Instead, you have to use onclick for that element.

Note:If u also have question or solution just comment us below or mail us on toontricks1994@gmail.com
Next Post »