Как использовать ajax для обновления базы данных mysql при изменении состояния флажка?

Question

У меня есть таблица статей, которая отображается в строках на стороне клиента.Каждая статья имеет уникальный идентификатор и содержит флажок, чтобы указать, отмечена ли эта статья как избранная.Если это избранное, то флажок уже установлен.Если нет, то это не проверяется.Теперь мне нужно js или jquery и ajax для обновления таблицы в БД, если и когда условие флажка изменяется специфично для каждой строки.Другая проблема заключается в том, что я работаю в среде cakePHP MVC.

<script type="text/javascript" src="jquery-1.2.1.min.js"></script>
<script type="text/javascript">

    function checkbox_click (id, favorite)
    {
        // see if checkbox is checked
        if(favorite==1)
        {
            $.ajax({
                type:'POST',
                url:'check_favorite.php', // this external php file isn't connecting to mysql db
                data:'id= ' + id + '&amp;favorite=1',
            });
        }// if
        // the checkbox was unchecked
        else
        {
            $.ajax({
                type:'POST',
                url:'check_favorite.php', // this external php file isn't connecting to mysql db
                data:'id= ' + id + '&amp;favorite=0',
            });
        }//else
    }
</script>

- html - это внутри цикла foreach.

echo "<input type='checkbox' id='$rowid;' name='favorite' checked='checked' onclick='checkbox_click('id','favorite',this();' />";


else
echo "<input type='checkbox' id='$rowid;' name='favorite'  onclick='checkbox_click('id','favorite',this.checked);' />";

- php-файл, вызываемый ajax--

<?php
//Database Variables - with the variables entered it doesn't connect
$dbhost = 'localhost';   // usually localhost
$dbuser = 'username';      // database username
$dbpass = 'password';      // database password

//Establish connection to MySQL database

$con = @mysql_connect($dbhost, $dbuser, $dbpass);
if (!$con)
die('Unable to connect.' . mysql_error());

mysql_select_db('devcake', $con);

// Get the variables.
$query = "UPDATE mytable SET favorite=".$_POST['favorite'] . "
WHERE id=".$_POST['id'] . ";";

mysql_query($query);
mysql_close($con);
?>

Answer 1

Это код, который я использую (спасибо Сэмюэлю)

 $('input[name=favorite]').live("click",function(){
    var id    = $(this).attr('id');

    if($(this).attr('checked')) {
        var favorite = 1;
    } else {
        var favorite = 0;
    }

    $.ajax({
        type:'GET',
        url:'favorites.php',
        data:'id= ' + id + '&favorite='+favorite
    });
    //console.log('id: ' + id + ' Publico: '+publico + 'Value: '+value);

 });

Answer 2

Это немного глупо!

Во-первых, давайте уточним HTML. Флажки по умолчанию отправляют значение «вкл», когда установлен флажок (если вы не указали value во входном теге, которого у вас нет). Продолжайте и полностью удалите событие onClick, поскольку мы будем делать это с jQuery, чтобы упростить вещи и лучше отделить ваше поведение от презентации.

Во-вторых, давайте правильно настроим ваш php-файл. Если вы на самом деле не изменили имя пользователя и пароль, скорее всего, их значения должны быть

$dbhost='localhost';
$dbuser='root';
$dbpass='';

Как только это соединение заработает, нам нужно исправить то, как мы работаем с опубликованными данными. Мне нравится делать это, пытаясь вытащить его в отдельные переменные, чтобы, если что-то пошло не так, я мог просто сделать print variable; и посмотреть, какое значение (если оно есть) у него есть.

Лучший способ получить опубликованные данные в вашем php-файле и запросить их, был бы следующий:

$id=$_POST['id'];
$favorite=$_POST['favorite'];
$query="UPDATE mytable SET favorite='$favorite' WHERE id='$id'";

То, что это делает, изменяет значение любимого столбца на 'on' или ''. Итак, перейдите к тому месту, где вы на самом деле выводите флажки, и вставьте несколько php, чтобы установить флажок, если он уже установлен в базе данных. Вот так.

 echo "<input type='checkbox' id='$rowid;' name='favorite'";
if(//check in database if 'favorite' column is set to 'on'){
print "checked='checked'";
 }
    echo "/>";

Обратите внимание на отсутствие события onClick. Мы справимся с этим с помощью jquery.

    $('input[name=favorite]').click(function(){
    //if a checkbox with name 'favorite' is clicked, do the following.
    //grab the id from the clicked box
    var id=$(this).attr('id');
    //grab the value from the checkbox (remember, if it is checked it will be 'on', else ''
    var favorite=$(this).val();
    //setup the ajax call
    $.ajax({
            type:'POST',
            url:'check_favorite.php',
            data:'id= ' + id + '&favorite='+favorite
        });
    }
    });

ТАМ. Уф. Я думаю, что об этом нужно позаботиться, если не о многом.

Answer 3

Измените ваши эхо-операторы на следующие, попробуйте и дайте мне знать, как это происходит:

echo "<input type='checkbox' id='$rowid;' name='favorite' checked='checked' onclick='checkbox_click('$rowid','favorite',this();' />";

else
echo "<input type='checkbox' id='$rowid;' name='favorite'  onclick='checkbox_click('$rowid','favorite',this.checked);' />";