Question

我对jqGrid完全不熟悉。我正在使用数据类型：local。

的数组填充网格

var data=[
  {date : "01/01/2012",starttime:"10:15",endtime:"11:15",workfunction:"MA"},
  {date : "01/02/2012",starttime:"11:30",endtime:"12:30",workfunction:"CA"},
  {date : "01/03/2012",starttime:"13:30",endtime:"14:30",workfunction:"FC"},
  {date : "01/01/2012",starttime:"10:15",endtime:"11:15",workfunction:"MA"},
  {date : "01/01/2012",starttime:"11:30",endtime:"12:30",workfunction:"CA"},
  {date : "01/02/2012",starttime:"13:30",endtime:"14:30",workfunction:"FC"},
  {date : "01/02/2012",starttime:"10:15",endtime:"11:15",workfunction:"MA"},
  {date : "01/03/2012",starttime:"11:30",endtime:"12:30",workfunction:"CA"},
  {date : "01/03/2012",starttime:"13:30",endtime:"14:30",workfunction:"FC"}
  ];

$("#gridTable").jqGrid({
    data : data,
    editurl:"clientArray",
    datatype: "local",
    height : 250,
    colNames: [' ','Date','Start Time','End Time','Work Function'],
    colModel : [
                {name: 'myac', width:80, fixed:true, sortable:false, resize:false, formatter:'actions',formatoptions:{keys:true}},
                {name: 'date',index:'date',width: 100,sorttype:'date',editable:true,editoptions : {
                    dataInit : function(element){
                        formatDatepicker(element,data);

                    }
                }},
                {name: 'starttime',index:'starttime',width: 100,sorttype:'date',editable:true},
                {name: 'endtime',index:'endtime',width: 100,sorttype:'date',editable:true},
                {name: 'workfunction',index:'workfunction',width: 100,sorttype:'date',editable:true,edittype:"select",editoptions:{value:"MA:MA;CA:CA;FC:FC"}},
                ],
                pager: "#gridPager",
                caption : "Weekly Details",
                grouping : true,
                groupingView : {
                    groupField:['date']
                }

}).navGrid("#gridPager",{edit:true,add:true,del:false},
        //edit properties
        {
    zIndex : 950,

        }
);

以上是我正在使用的网格。我根据日期对网格进行分组，我使用jsp作为服务器端技术。我的问题是：

我们可以在不向服务器提交行的情况下向组添加行。
如果使用新日期创建新行，则会形成新的组。
我们可以编辑多行并一次提交所有内容。

Answer 1

让我确定我是否理解你... 1。你想在网格中添加一行，但又不想将数据提交给服务器？它有可能...... 2。你必须更清楚这个要求。 3.是的，可以获取多行的所有编辑数据并将数据发送到服务器。

我将从3开始。

你可以使用multiselect：这里是true，它就像最简单的选择。选择要编辑的行和实现onSelectRow，其功能将使您的行在选择时可编辑。

然后你可以有一个按钮，它将你编辑过的行数据带到服务器。

如何在选择行时编辑行



onSelectRow: function(id){ 
jQuery('#grid').editRow(id, true); }

onSelectRow: function(id){ jQuery('#grid').editRow(id, true); }

或者还有另一种方法可以将所有行保持在可编辑模式

gridComplete:OnGridComplete, //add this to your Jqgrid parameters

javascript function

function OnGridComplete(){

            var $this = $(this), rows = this.rows, l = rows.length, i, row;
            for (i = 0; i < l; i++) {
                row = rows[i];
                if ($.inArray('jqgrow', row.className.split(' ')) >= 0) {
                    $this.jqGrid('editRow', row.id, true);
                }
            }

        }

以及如何只需点击一下即可将编辑过的数据带到服务器，请参阅我的回答

https://stackoverflow.com/a/11662959/1374763

现在第一个问题

您应该将editUrl更改为clientarray，

jQuery（“＃grid_id”）。jqGrid（'saveRow'，“rowid”，false，'clientArray'）;

检查此链接并转到saveRow参数，了解更多信息

http://www.trirand.com/jqgridwiki/doku.php?id=wiki:inline_editing

如何在jqGrid中的组中添加新行？

1 个答案: