Question

我有一个带有“multipleSearch = true”和“multipleGroup = true”的jqGrid，以允许复杂的搜索。

我为列设置了“stype”（在我的例子中，这包括“date”，“text”，“integer”和“currency”）。

我还分别为“date”和“text”列的DatePicker和AutoComplete插件提供了“dataInit”函数。

当我打开搜索对话框时，会调用自动完成“dataInit”函数，但不会调用DatePicker“dataInit”函数。

这似乎是因为“dataInit”函数在创建新过滤器时触发，并且基于第一列的“stype”。

（我应该怀疑当用户从“搜索”对话框的下拉列表中选择一列时会触发。）

当用户想要搜索“日期”字段并为其他字段“stypes”禁用时，是否有办法显示DatePicker？

我在下面列出了相关的代码段：

var DatePickerCfg = { id: 'DatePicker',dateFormat: 'dd/mm/yy',minDate: new Date(1990,0,1),maxDate: new Date(2099,12,31),showOn: 'focus' };
var AutoCompleteCfg = { id: 'AutoComplete',source: '' };



var formatoptions = {};
var searchoptions = {};


else if (Field['Type'] == '[datetime]')
{
 stype = 'date';
 formatoptions = {srcformat: 'Y-m-dTH:i:s', newformat: 'd/m/Y g:i:s A'};
 searchoptions = {sopt: ['eq','ne','lt','le','gt','ge'], dataInit: function(el) {setTimeout(function() {jQuery(el).datepicker(DatePickerCfg);}, 200);}};
}
else {searchoptions = {sopt: ['eq','ne','lt','le','gt','ge','bw','bn','ew','en','cn','nc'], dataInit:function(el) {setTimeout(function() {jQuery(el).autocomplete(AutoCompleteCfg);},200);}};}

colModel.push({name:Field['Field'], index:Field['Field'], align:Field['Align'], sortable:true, stype:stype, formatter:stype, formatoptions:formatoptions, searchoptions:searchoptions});

Answer 1

我没有必须使用搜索对话框，但在使用内联编辑时遇到了类似的问题。问题是DatePicker需要知道它将采取行动的DOM元素。 dataInit会提前触发。我确定您使用setTimeout函数的原因，文档声明可以将其用作替代 - 奇怪的是它不起作用。

我通过以下方式解决了这个问题：

colModel:[ {classes:'applyDatePicker',edittype:"checkbox"

当行进入editMode时，有一个回调函数

function onEditRow(rowId) { 
    var dp = jQuery('.applyDatePicker>input[type="text"]');
    jQuery(dp).each(function () {
        jQuery(this).bind('click', function () {
            jQuery(this).datepicker();
            jQuery(this).focus();
        });
    });
}

也许您可以使用类似的方法，而是将其应用于afterShowSearch回调函数？

Answer 2

这是我的错......我把日期栏上的stype设置为“date”而不是“text”。 stype是指搜索对话框中的输入类型，而不是数据类型。（我通过拖网源代码发现了这一点）

jqGrid DatePicker未在复杂搜索对话框中初始化

2 个答案: