jqGrid - 内联编辑无法在编辑后将结果保存到数据库
问题描述:
我是新来使用jqGrid,并且在尝试使用内联编辑功能时出现问题。这里是我的代码: 我的第一个网格jqGrid - 内联编辑无法在编辑后将结果保存到数据库
<link rel="stylesheet" type="text/css" media="screen" href="css/ui-lightness/jquery-ui-1.8.16.custom.css" />
<link rel="stylesheet" type="text/css" media="screen" href="css/ui.jqgrid.css" />
<style type="text/css">
html, body {
margin: 0;
padding: 0;
font-size: 75%;
}
</style>
<script src="js/jquery-1.5.2.min.js" type="text/javascript"></script>
<script src="js/i18n/grid.locale-en.js" type="text/javascript"></script>
<script src="js/jquery.jqGrid.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(function(){
var lastsel2
$("#list").jqGrid({
url:'example.php',
datatype: 'xml',
mtype: 'GET',
colNames:['id','name', 'status'],
colModel :[
{name:'id', index:'id', width:55},
{name:'name', index:'name', width:90, editable: true},
{name:'status', index:'status', width:80, align:'right', editable: true},
],
onSelectRow: function(id){
if(appid && appid!==lastsel2){
jQuery('#list').restoreRow(lastsel2);
jQuery('#list').editRow(id,true);
lastsel2=id;
}
},
editurl: "example.php",
pager: '#pager',
rowNum:10,
rowList:[10,20,30],
sortname: 'appid',
sortorder: 'desc',
viewrecords: true,
gridview: true,
caption: 'My first grid'
});
});
</script>
</head>
<body>
<table id="list"><tr><td/></tr></table>
<div id="pager"></div>
</body>
问题是,它可以编辑该行,当我点击它,也可以保存后暂时我按回车。但是当我重新加载网格时,它仍然在我之前显示之前的数据,这意味着它不会更新数据库。我想知道为什么以及如何解决它?
下面是使用example.php代码:
<?php
include("dbconfig.php");
$page = $_GET['page'];
$limit = $_GET['rows'];
$sidx = $_GET['sidx'];
$sord = $_GET['sord'];
if (!$sidx)
$sidx = 1;
$db = mysql_connect("$dbhost", "$dbuser", "$dbpassword") or die("Connection Error: " . mysql_error());
mysql_select_db("$database") or die("Error connecting to db.");
$result = mysql_query("SELECT COUNT(*) AS count FROM app");
$row = mysql_fetch_array($result, MYSQL_ASSOC);
$count = $row['count'];
if ($count > 0 && $limit > 0) {
$total_pages = ceil($count/$limit);
} else {
$total_pages = 0;
}
if ($page > $total_pages)
$page = $total_pages;
$start = $limit * $page - $limit;
if ($start < 0)
$start = 0;
$SQL = "SELECT id, name, status FROM app";
$result = mysql_query($SQL) or die("Couldn't execute query." . mysql_error());
header("Content-type: text/xml;charset=utf-8");
$s = "<?xml version='1.0' encoding='utf-8'?>";
$s .= "<rows>";
$s .= "<page>" . $page . "</page>";
$s .= "<total>" . $total_pages . "</total>";
$s .= "<records>" . $count . "</records>";
// be sure to put text data in CDATA
while ($row = mysql_fetch_array($result, MYSQL_ASSOC)) {
$s .= "<row id='" . $row['id'] . "'>";
$s .= "<cell>" . $row['id'] . "</cell>";
$s .= "<cell>" . $row['name'] . "</cell>";
$s .= "<cell>" . $row['status'] . "</cell>";
$s .= "</row>";
}
$s .= "</rows>";
echo $s;
?>
答
首先你应该代码
onSelectRow: function(id){
if(appid && appid!==lastsel2){
jQuery('#list').restoreRow(lastsel2);
jQuery('#list').editRow(id,true);
lastsel2=id;
}
}
更改为类似
onSelectRow: function (id) {
if (id && id !== lastsel2){
jQuery('#list').restoreRow(lastsel2);
jQuery('#list').editRow(id,true);
lastsel2 = id;
}
}
,因为目前使用未定义appid
而不是id
。
此外,您应该删除末尾的逗号colModel
的结尾处:将},]
更改为}]
,并在var lastsel2
之后放置分号。
谢谢你的帮助,但我做了你所说的,它仍然不起作用。我想知道jqgrid会在数据编辑完成后自动更新到数据库吗?如果没有,我需要调用saveRow方法来创建它还是其他? – user878729
@ user878729:在用户按下“Enter”后,editRow调用'saveRow'实习生。可能你在服务器端*在URL“example.php”下有问题*(参见你使用的editurl参数)。 jqGrid只是将修改后的数据发送到URL和Web服务器(您的PHP代码在'example.php'下)负责将修改后的数据保存到数据库中。 – Oleg
我检查了example.php,发现我没有sql语句从saveRow获取数据,并执行sql。我想这是问题所在。你能告诉我我能做到吗?谢谢! – user878729