Question

你好，我试了两个星期，我的jqgrid工作没有成功。我对这个lenguaje不太了解。我让网格从de数据库带给我数据，但每次我编辑或添加一个新行时，更改都不适用于数据库只在屏幕上更改。然后我刷新chage消失的页面。帮助！

这是datos.js

jQuery("#grid_id").jqGrid({
    url:'conec.php',
datatype: "json",
colNames:['id','name', 'record_id', 'created_at','updated_at','deleted_at'],
colModel:[
    {name:'id',index:'id', width:55,editable:false,editoptions:{readonly:true,size:10}},
    {name:'name',index:'name', width:80,editable:true,editoptions:{size:10}},
    {name:'record_id',index:'record_id', width:90,editable:true,editoptions:{size:25}},
    {name:'created_at',index:'created_at', width:60, align:"right",editable:true,editoptions:{size:10}},
    {name:'updated_at',index:'updated_at', width:60, align:"right",editable:true,editoptions:{size:10}},
    {name:'deleted_at',index:'deleted_at', width:60,align:"right",editable:true,editoptions:{size:10}},
    ],
rowNum:10,
rowList:[10,20,30],
pager: '#gridpager',
sortname: 'id',
viewrecords: true,
sortorder: "desc",
caption:"Navigator Example",
editurl:"editurl.php",
height:210});
jQuery("#grid_id").jqGrid('navGrid','#gridpager',
{}, //options
{height:280,reloadAfterSubmit:false}, // edit options
{height:280,reloadAfterSubmit:false}, // add options
{reloadAfterSubmit:false}, // del options
{} // search options
);

这是index.html

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>My First Grid</title>

<link rel="stylesheet" type="text/css" media="screen" href="css/ui-lightness/jquery-ui-      1.8.6.custom.css" />
<link rel="stylesheet" type="text/css" media="screen" href="css/ui.jqgrid.css" />

<style type="text">
    html, body {
    margin: 0;          /* Remove body margin/padding */
    padding: 0;
    overflow: hidden;   /* Remove scroll bars on browser window */
    font-size: 75%;
    }
</style>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Documento sin t&iacute;tulo</title>
</head>

<body>
 <table id="grid_id"></table>
 <div id="gridpager"></div>
</body>
 <script src="js/jquery-1.4.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 src="datos.js" type="text/javascript"></script>
</html>

这是conec.php（连接）

<?php
 include_once 'lib.php';

 $conexion= mysql_connect('localhost', 'root', '');
 mysql_select_db("taskmaker", $conexion);
 $result = mysql_query("SELECT id, name, record_id, created_at, updated_at, deleted_at       FROM Team", $conexion);

$i=0;
while($row = mysql_fetch_array($result,MYSQL_ASSOC)) {
$responce->rows[$i]['id']=$row[id];
$responce->rows[$i]   ['cell']=array($row[id],$row[name],$row[record_id],$row[created_at],$row[updated_at],$row[d  eleted_at]);
$i++;
}
echo json_encode($responce);
?>

这是lib.php

<?php
$dbhost = "localhost";
$dbuser = "root";
$dbpassword = "";
$database = "taskmaker";
?>

这就是全部。

Answer 1

jqGrid支持不同的方式来编辑网格的包含：cell editing，inline editing，form editing。您当前的代码使用form editing。您可以在the demo中看到正在进行的修改。在左侧树部分选择项目“实时数据操作”，然后选择“导航器”。另请参阅“行编辑”/“输入类型”以了解inline editing的外观。

用户完成行编辑并按“提交”按钮后，有关添加/更改/删除的行的信息将发布到jqGrid的editurl参数定义的URL（editurl.php在您的案件）。与行数据一起，作为附加参数，将发布oper，"add"，"edit"或"del"字符串和id可以是如果要添加新行，请"_empty"。如果添加新行，您的服务器代码必须返回新添加的行的id。使用Fiddler或Firebug查看在行编辑期间将向服务器发送和返回的内容非常有用。

因此，editurl.php的实现是您在服务器代码中遗漏的内容。

jqgrid，帮助添加，编辑和删除行

1 个答案: