Jquery 关闭日期选择器时jqgrid保存单元格编辑

Jquery 关闭日期选择器时jqgrid保存单元格编辑,jquery,jqgrid,Jquery,Jqgrid,我有以下JQGrid $("#requestTable").jqGrid({ url: url, datatype: 'json', mtype: 'GET', altRows: 'true', colNames: ['id', 'Request Date', 'Name', 'HomePhone', 'Address', 'Contact Date', 'Email'], colModel: [ { na

我有以下JQGrid

    $("#requestTable").jqGrid({
    url: url,
    datatype: 'json',
    mtype: 'GET',
    altRows: 'true',
    colNames: ['id', 'Request Date', 'Name', 'HomePhone', 'Address', 'Contact Date', 'Email'],

    colModel: [
                { name: 'Id', index: 'Id', hidden: true },
                { name: 'RequestDate', index: 'RequestDate', width: 100 },
                { name: 'FullName', index: 'FullName', width: 125, sortable: false },
                { name: 'HomePhone', index: 'CabinetColor', width: 90, sortable: false },
                { name: 'FullAddressString', index: 'ShellColor', width: 260, sortable: false },
                { name: 'DealerContactDate', index: 'DealerContactDate', width: 105, editable: true,
                     editoptions:{
                          dataInit:function(element){
                              $(element).datepicker();
                          }
                     }

                 },
                { name: 'Email', index: 'Email', width: 110, sortable: false }

            ],
    cellEdit:true,
    cellurl:cellurl,
    pager: '#pager',
    rowNum: 50,
    rowList: [ 25, 50, 75, 100],
    sortname: 'id',
    sortorder: "desc",
    viewrecords: true,
    height: "100%"

});
})

如您所见,DealerContactDate单元格可以使用日期选择器进行编辑。 在datepicker中选择日期并关闭后,jqgrid是否会立即保存数据? 现在,用户必须从日期选择器中选择一个日期。然后再次选择该文本框并按enter键,这太复杂了。 谢谢

更新: 我在jqrid之外为row和cell创建了两个变量,然后在网格afterEditCell事件上设置这些变量。然后在datepickers onSelect事件上,将这些消息传递给saveCell函数,它似乎可以工作

 var saverow = 0;

var savecol = 0;
$("#requestTable").jqGrid({
    url: url,
    datatype: 'json',
    mtype: 'GET',
    altRows: 'true',
    colNames: ['id', 'Request Date', 'Name', 'HomePhone', 'Address', 'Contact Date', 'Email'],

    colModel: [
                { name: 'Id', index: 'Id', hidden: true },
                { name: 'RequestDate', index: 'RequestDate', width: 100 },
                { name: 'FullName', index: 'FullName', width: 125, sortable: false },
                { name: 'HomePhone', index: 'CabinetColor', width: 90, sortable: false },
                { name: 'FullAddressString', index: 'ShellColor', width: 260, sortable: false },
                { name: 'DealerContactDate', index: 'DealerContactDate', width: 105, editable: true,
                    editoptions: {
                        dataInit: function (element) {
                            $(element).datepicker({
                                onSelect: function () {
                                    $("#requestTable").jqGrid("saveCell", saverow, savecol);
                                }
                            });
                        }
                    }

                },
                { name: 'Email', index: 'Email', width: 110, sortable: false }

            ],
    cellEdit: true,
    pager: '#pager',
    rowNum: 50,
    rowList: [25, 50, 75, 100],
    sortname: 'id',
    sortorder: "desc",
    viewrecords: true,
    height: "100%",
    cellurl: cellurl,
    afterEditCell: function (id, name, val, IRow, ICol) {
        saverow = IRow;
        savecol = ICol;
    }

});

您应该能够将来自datePicker的事件与来自jqGrid的事件结合使用。比如:

   $(element).datepicker({
      onSelect: function(dateText, inst) { 
          var $input = inst.input; // the datepicker input
          var $row = $input.parents("tr"); 
          $("#requestTable").jqGrid('saveRow',$row.attr("id"), false); // this would probably need some work, I have no experience with jqGrid
   });

嗨,我有不同的问题。i、 e.从日期选择器中选择日期后聚焦单元格。我从上面的答案1中修复了它,尽管这个答案不是针对我的问题的。 基本上,为了在jQGrid中选择日期后保持单元格聚焦, -在日期选择器onSelect方法上激发“saveCell”事件,如Answer1所示。 -在beforeEditCell方法中分配saveRow和saveCol变量(&S)


感谢大家。

确保id正确且存在,只需通过警报$row.attrid对其进行测试;在您调用$requestTable.jqGrid'saveRow'之前,…我需要做一些稍微不同的事情,但您让我走上正轨,这样您就可以得到答案。我更新的代码显示了我是如何让它工作的。