jqGrid DatePicker过滤而不按Enter键

Question

我正在构建我的第一个ASP.NET MVC 3应用程序并使用jqGrid.我的一个专栏"Flavor Created"是一个日期列,我想使用DatePicker过滤该列上的网格.以下是当前发生的情况:用户点击列标题过滤器框,显示日期选择器,然后用户选择年,月和每天点击.选择器消失并在文本框中留下日期,比如说,03/28/2009.要实际让过滤器工作,我必须单击该框并按Enter键,这对用户来说有点烦人.

当用户点击那天时,有没有办法让过滤器自动触发？

(顺便说一句,我不确定'完成'按钮的用途是什么,因为每当我点击一天时,选择器就会消失.也许这是我缺少的设置.)

其他人需要这个功能并解决了吗？

我试着这样做:

dataInit: function (elem) {
  $(elem).datepicker({ changeYear: true, changeMonth: true, showButtonPanel: true,
    onSelect: function (dateText, inst) {
       $("#icecreamgrid")[0].trigger("reloadGrid");
    }
  })
}

正如我在一些网站上看到有人建议的那样,但这似乎没有用.

Answer 1

你可以试试

dataInit: function (elem) {
    $(elem).datepicker({
        changeYear: true,
        changeMonth: true,
        showButtonPanel: true,
        onSelect: function() {
            if (this.id.substr(0, 3) === "gs_") {
                // in case of searching toolbar
                setTimeout(function(){
                    myGrid[0].triggerToolbar();
                }, 50);
            } else {
                // refresh the filter in case of
                // searching dialog
                $(this).trigger("change");
            }
        }    
    });
}

已更新:使用版本4.3.3的jqGrid初始化电网的DOM作为开始this的dataInit.因此,不需要myGrid在上面的代码中使用变量.而不是那个可以使用:

dataInit: function (elem) {
    var self = this; // save the reference to the grid
    $(elem).datepicker({
        changeYear: true,
        changeMonth: true,
        showButtonPanel: true,
        onSelect: function() {
            if (this.id.substr(0, 3) === "gs_") {
                // in case of searching toolbar
                setTimeout(function () {
                    self.triggerToolbar();
                }, 50);
            } else {
                // refresh the filter in case of
                // searching dialog
                $(this).trigger("change");
            }
        }    
    });
}

使用第二个options参数释放jqGrid dataInit,其中包含附加信息,如mode属性.如果在过滤器工具栏内部调用(并且在搜索对话框的情况下),则mode属性的值.因此可以使用以下代码"filter""search"

dataInit: function (elem, options) {
    var self = this; // save the reference to the grid
    $(elem).datepicker({
        changeYear: true,
        changeMonth: true,
        showButtonPanel: true,
        onSelect: function() {
            if (options.mode === "filter") {
                // in case of searching toolbar
                setTimeout(function () {
                    self.triggerToolbar();
                }, 0);
            } else {
                // refresh the filter in case of
                // searching dialog
                $(this).trigger("change");
            }
        }    
    });
}