anters anters - 1 year ago 125
Ajax Question

Using AJAX to post checkbox list without submit button

I have a list of checkboxes, and want to submit the value of the checkbox when it is checked to PHP. I would prefer not to have a submit button, and rather post the value each time a checkbox is checked, so that the form does not refresh and clear the checked checkbox. However, each time I click one of the checkboxes, nothing happens.

Here is the HTML:

<form method="post" action="this.form.submit();" name="form1">
<input type="checkbox" name="checkboxList[]" onclick="function1();" value="1">value1</input>
<input type="checkbox" name="checkboxList[]" onclick="function1();" value="2">value2</input>
<input type="checkbox" name="checkboxList[]" onclick="function1();" value="3">value3</input>

Here is the JQuery:

function function1() {
var data = $("form1").serialize();
url: "test.php",
type: "POST",
async: true,
cache: false,
data: data,
success: function(data){

Edit: Sorry, forgot to mention that I have included the JQuery library.

And "test.php":


Answer Source

Instead of var data = $("form1").serialize(); you should use var data = $("[name='form1']").serialize(). Using a plain string like that won't find you anything. You must specify that you want the element with the name, 'form1'

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download