Флажки AJAX с JQuery и PHP

У меня есть два ряда флажков. Когда пользователь нажимает на какой-либо отдельный флажок (в определенной строке), я хочу добавить число к моей сумме в PHP. Если он отменит выбор отдельного флажка, я хочу вычесть из общего количества в реальном времени без обновления страницы. Мой вопрос, что происходит в поле данных моего звонка AJAX?

и это правильный способ сделать это?

HTML

<input type="checkbox" name="standard_form[]" value="A" onclick="processForm()"> <input type="checkbox" name="premium_form[]" value="B" onclick="processForm()"> 

Jquery

 <script type="text/javascript"> function processForm() { $.ajax( { type: 'POST', url: 'submit_form.php', data: '', success: function(data) { $('#message').html(data); } } ); } </script> 

PHP

  if(IsChecked('standard_form','A')) { $price += IsChecked('standard_form','A') ? 10 : 0; } return $price ; 

Пытаться:

 <script type="text/javascript"> function processForm() { $.ajax( { type: 'POST', url: 'submit_form.php', data: { checked_box : $('input:checkbox:checked').val()}, success: function(data) { $('#message').html(data); } } ); } </script> 

Вы должны сериализовать форму в объект JS, вот что входит в поле данных. Вот простая функция сериализации, которая может быть улучшена, но даст вам представление

 function serializeForm(form) { var obj = {}; for (var i = 0; i < form.elements.length; i++) { var el = form.elements[i]; if (el.name) { if (obj[el.name] && obj[el.name].constructor == Array ) { obj[el.name].push(el.value); } else if (obj[el.name]) { obj[el.name] = [obj[el.name], el.value]; } else { obj[el.name] = el.value; } } } return obj; } 

Существует плагин, который позволяет вам отправлять формы с AJAX легко http://jquery.malsup.com/form/ См. JQuery AJAX submit form

Предполагая следующий HTML

 <form id="myForm" action="submit_form.php" method="post"> <input type="checkbox" name="standard_form[]" value="A" onclick="processForm()"> <input type="checkbox" name="premium_form[]" value="B" onclick="processForm()"> </form> 

Вы можете просто сделать следующее, чтобы форма была отправлена ​​с помощью AJAX

 // attach handler to form's submit event $('#myForm').submit(function() { // submit the form $(this).ajaxSubmit(); // return false to prevent normal browser submit and page navigation return false; }); 

В checkboxes попробуйте onclick="processForm(this)" , затем в JavaScript:

 <script type="text/javascript"> function processForm(elm) { $.ajax( { type: 'POST', url: 'submit_form.php', data: elm.name+'='+elm.value, success: function(data) { $('#message').html(data); } } ); } </script>