Question

我是新手使用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;
?>

Answer 1

首先，您应该更改代码

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 - 内联编辑在编辑后无法将结果保存到数据库

1 个答案: