jqGrid内联编辑在日期选择器列中失效问题求助

我之前在使用jqGrid行内编辑功能时，也碰到过完全一样的问题——修改普通列按回车能正常保存并退出编辑模式，但选完日期列的日期后按回车毫无反应。查了一圈后发现，核心原因是日期选择器在关闭后，焦点并没有回到对应的输入框上，导致jqGrid的回车触发保存事件根本没被捕获到。

这里给你两个经过验证的可行解决方案：

方案一：关闭日期选择器后聚焦输入框并模拟回车 #

你可以在日期列的editoptions里配置dataInit函数，给日期选择器绑定onClose事件，强制把焦点拉回输入框并手动触发回车：

colModel: [
  // 其他列配置...
  {
    name: 'orderDate',
    label: 'Order Date',
    editable: true,
    edittype: 'text',
    editoptions: {
      dataInit: function(element) {
        $(element).datepicker({
          dateFormat: 'yy-mm-dd', // 按你的需求调整日期格式
          onClose: function(dateText, inst) {
            // 关闭选择器后立刻聚焦输入框
            $(element).focus();
            // 手动模拟回车按键，触发jqGrid的保存逻辑
            $(element).trigger($.Event('keydown', { keyCode: 13 }));
          }
        });
      }
    }
  }
]

这个方法的逻辑很直接：让输入框重新获得焦点，再模拟用户按回车的操作，让jqGrid识别到保存指令。

方案二：直接调用jqGrid的行保存方法 #

如果方案一的模拟回车还是有兼容性问题，你可以在onClose事件里直接调用jqGrid的saveRow方法，跳过按键触发的环节：

onClose: function(dateText, inst) {
  // 获取当前编辑行的ID
  var rowId = $(element).closest('tr.jqgrow').attr('id');
  // 直接调用jqGrid的保存行方法
  $('#yourGridId').jqGrid('saveRow', rowId);
}

这个方式更硬核，不需要依赖焦点和按键事件，关闭日期选择器后直接触发保存逻辑，稳定性更强。

额外提醒 #

• 注意确认你的jqGrid版本和日期选择器版本是否兼容，部分旧版本可能存在事件冲突问题
• 如果你用的是Guriddo jqGrid自带的日期控件，原理完全一致，只需要找到对应的关闭回调事件配置即可

内容的提问来源于stack exchange，提问作者Jay