部分用AJAX更新列表

Question

我有一个来自数据库的列表，我想实现编辑功能，在onclicking一个表列时，该列变为可编辑状态，点击列外时，值得到更新。

我已经为此使用了AJAX。我的代码下：

page1.php中

<script src="http://code.jquery.com/jquery-1.10.2.js"></script> 
<script> 
function showEdit(editableObj) 
{ 
$(editableObj).css("background","#FFF"); 
} 
function saveToDB(editableObj,column,id) 
{ 
$.ajax(
{ 
    url: "page2.php", 
    type: "POST", 
    data:'column='+column+'&editval='+editableObj.innerHTML+'&id='+id, 
    success: function(data) 
    { 
    $(editableObj).css("background","#FDFDFD"); 
    }   
}); 
} 
</script> 

我的表的列是为下：

<td contenteditable="true" onBlur="saveToDB(this, 'exmid','<?php echo $p0; ?>')" 
     onClick="showEdit(this);"><?php echo $p3 ?> 

注：$ P0包含序列号行从MySQL数据库表和$ p3包含显示的文本。

为使page2.php的代码是：

<?php 
include_once 'includes/db_connect.php'; 
?> 
<?php 
$result = mysql_query("UPDATE examlist1 set " . $_POST["column"] . " =  '".$_POST["editval"]."' WHERE sno=".$_POST["id"]); 
?> 

问题： 当我点击栏就变成可编辑的。在saveToDB（）中使用alert（）我已检查该功能是否在单击列外时调用，并且值列和id是正确的。

然后我尝试了alert（）函数里面的$ .ajax，它没有被调用。我不确定ajax是否正在运行。这是我第一次尝试在php代码中使用ajax。

请提出什么问题和解决方案？该代码正在使用PHP 5.4在Godaddy托管的基于Linux的服务器上实施。

另外我想设置背景颜色失败。如何在ajax块内写入它？

Answer 1

如果您在alerting时得到正确的值。在您的page2.php中。使用mysqli而不是mysql，并使用mysqli_query()中的$connection对象。

<?php 
include_once 'includes/db_connect.php'; 
$column=$_POST["column"]; 
$editval=$_POST["editval"]; 
$id=$_POST["id"]; 
$result = mysqli_query($connection,"UPDATE examlist1 SET $column='$editval' WHERE sno=$id");//$connection is database connection variable 
if ($result) 
{ 
    echo json_encode(array('success'=>true)); 
} 
else 
{ 
    echo json_encode(array('success'=>false)); 
} 
?> 

这里的Javascript：尝试100分％的作品（定义要在if/else声明什么）

<script src="http://code.jquery.com/jquery-1.10.2.js"></script> 
<script> 
function showEdit(editableObj) 
{ 
$(editableObj).css("background","#FFF"); 
} 
function saveToDB(editableObj,column,id) 
{ 
$.ajax(
{ 
    url: "page2.php", 
    type: "POST", 
    data:'column='+column+'&editval='+editableObj.innerHTML+'&id='+id, 
    success: function(data) 
    { 
    var res=eval(data); 
    //if success then 
    if (res.success) 
    { 
     //write JS code that you want after successful updation 

    $(editableObj).css("background","#FDFDFD"); //<- according to problem 
    } 
    //if fails then 
    else 
    { 
     //write JS code that you want after unsuccess 
    } 
    }   
}); 
} 
</script>