Question

我是jqGrid的新手，所以希望有人可以指出我正确的方向。

基本上，我使用jgGrid显示我从一个文件中读入的日期和成本列表，我希望用户能够修改或添加新条目或删除现有条目。当用户单击屏幕上的“应用”按钮以回发表单时，我读出了jqGrid并以JSON字符串的形式发回服务器。

我的问题是，当我添加新行时（通过'editGridRow'），jqGrid正在使用它自动生成的jqg1，jg2，jg3等，并且新行被填充在网格顶部而不是它们的行id位置即在网格的底部。

我可以根据需要生成RowID，但是在创建新条目时我似乎无法将它们提供给'editGridRow'，而是看来我必须使用关键字“new”。

如您所知，我使用editGridRow而不是addRowData的原因是editGridRow创建了一个模式对话框供用户输入数据。

任何帮助都将不胜感激。

This is what I would like to use to supply a row ID: $("#tableGrid").jqGrid('editGridRow', gridRowID, {reloadAfterSubmit:false});

This is what I have to use to get the code to work: $("#tableGrid").jqGrid('editGridRow', "new", {reloadAfterSubmit:false});

以下是我用于在JSP中创建gqGrid的代码片段：

var gridRowID = ${costHistoryEntries}.length



    $("document").ready(function() {

            $("#tableGrid").jqGrid({
                data: ${costHistoryEntries},
                datatype: "local", 
                height: 200, 
                colNames:['Date', 'Cost'],
                colModel:[ 
                        {name:'chdate', index:'chdate', width:110, sorttype:"date", editable:true, editrules:{date:true, required:true, custom:true, custom_func:checkDate}, datefmt:'d/m/Y'}, 
                        {name:'cost', index:'cost', width:160, align:"right", sorttype:"float", editable:true, editrules:{number:true, required:true}, formatter:'float'},
                ],
                autowidth: true,
                loadonce: true,
                sortname: 'chdate',
                sortorder: "desc", 
                rowList:[10, 20, 30],
                pager: jQuery('#tablePager'),
                viewrecords: true,
                editurl: '/myurl',
                caption: "Cost History Entries" }

            ); 

            $("#tableGrid").jqGrid('navGrid', "#tablePager", {edit:true, add:true, del:true, search:true, refresh:true});

            $("#addEntry").click(function() {
                gridRowID++;
                $("#tableGrid").jqGrid('editGridRow', "new", {reloadAfterSubmit:false});
            });
    });

$("document").ready(function() { $("#tableGrid").jqGrid({ data: ${costHistoryEntries}, datatype: "local", height: 200, colNames:['Date', 'Cost'], colModel:[ {name:'chdate', index:'chdate', width:110, sorttype:"date", editable:true, editrules:{date:true, required:true, custom:true, custom_func:checkDate}, datefmt:'d/m/Y'}, {name:'cost', index:'cost', width:160, align:"right", sorttype:"float", editable:true, editrules:{number:true, required:true}, formatter:'float'}, ], autowidth: true, loadonce: true, sortname: 'chdate', sortorder: "desc", rowList:[10, 20, 30], pager: jQuery('#tablePager'), viewrecords: true, editurl: '/myurl', caption: "Cost History Entries" } ); $("#tableGrid").jqGrid('navGrid', "#tablePager", {edit:true, add:true, del:true, search:true, refresh:true}); $("#addEntry").click(function() { gridRowID++; $("#tableGrid").jqGrid('editGridRow', "new", {reloadAfterSubmit:false}); }); });

我还创建了一个按钮并将其链接到“addEntry”，作为使用jqGrid Navigator“add / edit / delete / find / reload”栏添加新行的替代方法。正如您在前面使用数据加载网格时所看到的那样，我存储了gridRowID中的条目数。我希望能够在“#addEntry”点击功能中使用更新的gridRowID作为RowID参数。

作为一个FYI：在以前版本的代码中，我使用以下内容将数据加载到网格中：

但发现我可以用

做同样的事情

            var griddata = ${costHistoryEntries};
            for (var i=0; i <= griddata.length; i++) {
                $("#tableGrid").jqGrid('addRowData', i+1, griddata[i], "last");
            }

两个版本都正确地为服务器提供的样本数据创建行ID： [{ “chdate”： “20/05/2011”， “成本”： “0.111”}，{ “chdate”： “01/06/2011”， “成本”： “0.222”}，{ “chdate”： “07/07/2011”， “成本”： “0.333”}]

我的问题是添加新的数据行。

进一步更新，在服务器端，作为测试，我截取了帖子到/ myurl并将id从“_empty”更新为“7”，但jqGrid中的新条目仍然具有自动生成的jqGrid行ID“jqg1”：

data: ${costHistoryEntries},

Answer 1

我不太明白你的要求。您从服务器获取jqGrid的输入，但是使用datatype: "local"代替datatype: "json" ，例如，它指示jqGrid向服务器发送ajax请求以获取数据如所须。此外，您希望在服务器上保存日期，但使用editurl: '/dummyurl'代替真实服务器网址。 editurl将从$("#tableGrid").jqGrid('editGridRow', "new", {reloadAfterSubmit:false});获取输入数据，并应回发新生成的行的ID。这不是你想要的吗？

所以我的建议是使用一些基于服务器的datatype（bast是datatype: "json"）并以同样的方式使用真实的editurl来保存服务器上的数据（在主要是数据库）并在服务器上响应新生成的数据项上的id。

更新：如果您使用editGridRow的reloadAfterSubmit: false选项，则必须使用afterSubmit事件处理程序和reloadAfterSubmit来解码服务器响应并返回结果格式为[true,'',new_id]例如，如果您的服务器只返回新的rowid作为您可以使用的数据

$("#tableGrid").jqGrid('editGridRow', "new",
    {
        reloadAfterSubmit: false,
        afterSubmit: function (response) {
            return [true, '', response.responseText];
        }
    }
);

如何在使用jqGrid'editGridRow'创建新行而不是自动生成的行ID jqg1时提供行ID

1 个答案: