php jquery save checkbox dynamically

Question

im bit confused how to save checkbox value dynamically in 1 table!

database:

id  PERSON   check
--------------------
1   Person1  1
2   Person2  1
3   Person3  1
4   Person4  0

HTML code:

<form id="availability">
Person1 <input type="checkbox" id="person1" value="1" checked>
Person2 <input type="checkbox" id="person2" value="1" checked>
Person3 <input type="checkbox" id="person3" value="1" checked>
Person4 <input type="checkbox" id="person4" value="0">
</form>

jquery:

$('#availability').submit(function(){
  $.post('include/setting.php', {
      person1: $('#person1').val(),
      person2: $('#person2').val(),
      person3: $('#person3').val(),
      person4: $('#person4').val(),
  }, function(data){

    if(data.success) {

    } else {

    }
  }, 'json');
  return false;
})

PHP:

$person1 = $_POST['person1'];
$person2 = $_POST['person2'];
$person3 = $_POST['person3'];
$person3 = $_POST['person4'];
$db->query("UPDATE person SET id='???");

Answer 1

You do not need a form that processes all of the inputs at one time, but only send a request for the modified field without using any form.

$('input:checkbox').change(function() {
  $.post('include/setting.php', {
    id: this.id,
    value: $(this).attr("checked")?1:0
  }, function(data){
    if(data.success) {
    } else {
    }
  }, 'json');
  return false;  
});

and for PHP:

$db->query("UPDATE person SET value=".$_POST['value']." WHERE  id=".$_POST['id'] );

Also remember to always escape queries with mysql_real_escape_string()

Answer 2

Your approach isn't the cleanest or most modular, but it can work. Here are direct modifications to your code which should help it out:

HTML

<form id="availability">
    Person1 <input type="checkbox" id="person1" value="1">
    Person2 <input type="checkbox" id="person2" value="1">
    Person3 <input type="checkbox" id="person3" value="1">
    Person4 <input type="checkbox" id="person4" value="1">
</form>

javascript

$( '#availability' ).submit( function()
{
    $.post(
        'include/setting.php',
        {
            persons: {
                person1: ( $( '#person1:checked' ).length ? 1 : 0 ),
                person2: ( $( '#person2:checked' ).length ? 1 : 0 ),
                person3: ( $( '#person3:checked' ).length ? 1 : 0 ),
                person4: ( $( '#person4:checked' ).length ? 1 : 0 )
            }
        },
        function( data )
        {
            if( data.success )
            {

            }
            else
            {

            }
        },
        'json'
    );

    return false;
} );

PHP

<?php
foreach( $_POST['persons'] as $personIdentifier => $checked )
{
    //DO PROPER CHECKS AND ESCAPING OF INCOMING DATA!!!!!!!
    $db->query( "UPDATE person SET check = {$checked} WHERE PERSON = '{$personIdentifier}'" );
}

Answer 3

To pass a 0 if unchecked and a 1 if checked, you can use the is method with the :checked selector to determine the checked value as a boolean then use the ternary operator to set your JSON value to 1 or 0 depending on the result.

$('#availability').submit(function(){
  $.post('include/setting.php', {
      "person1" : $('#person1').is(':checked') ? 1 : 0,
      "person2" : $('#person2').is(':checked') ? 1 : 0,
      "person3" : $('#person3').is(':checked') ? 1 : 0,
      "person4" : $('#person4').is(':checked') ? 1 : 0,
  }, function(data){

    if(data.success) {

    } else {

    }
  }, 'json');
  return false;
})