jquery for check / uncheck复选框和传递参数

时间:2015-05-20 12:57:52

标签: php jquery ajax

我有一个任务列表,其中包含已完成/未完成任务的复选框。我正在努力实现它,所以当检查任务时,它使用ajax来更新表以说明它已经完成。反之亦然,取消将发送命令将其从完成更改为未完成。

该方法正在努力使用,但意识到我无法实现我想要的是:

$ taskid =每项任务的唯一ID。

'<input  type="checkbox" onclick="checkboxChecked('.$taskid.')" value="1" >'

单击此按钮时,它将调用以下函数(并将taskid传递给它)

function checkboxChecked(id)
{
var x = "task"+id;

$.ajax({
  method: "POST",
  url: "form_taskchecked.post.php",
  data: { action: "checked", 
          id: id }
})

.done(function( msg ) {
    //success
     $('#'+x).toggleClass("task-done");        


})
.fail(function( jqXHR, textStatus ) {
    alert( "Request failed: " + textStatus );
});


}

在我的服务器端,php看起来像这样

if ($_POST['action'] == "checked") {
//SEND SQL TO LIST TASK AS COMPLETED

}
else if ($_POST['action'] == "unchecked") {
//SEND SQL TO LIST TASK AS NOT COMPLETED
}

当我到达这一点时,我意识到我需要第二个函数用于ajax调用,而不是发送相同的细节,但操作为“未选中”。但是我该怎么做呢,如果我使用事件处理程序而不是这样,我不明白我怎么能(a)引用一个特定的复选框(我是否会听一个类而且所有的复选框都有这个类? )和(b)如何将taskid的值传递给它,这是php部分所需要的。

$('#myCheckBox').click (function ()
{
var thisCheck = $(this);
if (thischeck.is (':checked'))
{
   // ajax call for checked box
}


});

总结一下,如何区分检查和取消选中并相应地发送ajax调用,并将ID值传递给它。

1 个答案:

答案 0 :(得分:0)

我的解决方法是改变php以接受2个变量。它将在2个状态之间切换。

if ($_POST['completed'] == 0) { 
$query ="UPDATE PRJ_tasklist SET completed = 1 WHERE (taskno=".$_POST['id'].")";
$result = odbc_exec($con1, $query);

}
else if ($_POST['completed'] == 1) { 
    $query ="UPDATE PRJ_tasklist SET completed = 0 WHERE (taskno=".$_POST['id'].")";
    $result = odbc_exec($con1, $query);
}

Ajax调用现在如下所示。在成功返回时,它会改变首先发送的Onclick事件。

function checkboxChecked(id,completed)
{
var x = "task"+id;

$.ajax({
  method: "POST",
  url: "form_taskchecked.post.php",
  data: { action: "checked", 
          id: id, 
          completed:completed //1 or 0
          }
})

 .done(function( msg ) {
    //success
     $('#'+x).toggleClass("task-done");
     $('#badgeicon'+id).toggleClass("hidden");
        //toggle the onclick function


         if (completed==1){
            $('#checkbox'+id).attr('onclick','checkboxChecked('+id+',0)');
         } else if (completed==0){
            $('#checkbox'+id).attr('onclick','checkboxChecked('+id+',1)');
         } 

})

.fail(function( jqXHR, textStatus ) {
    alert( "Request failed: " + textStatus );
});


}