jqGrid，搜索日期

Question

我的数据在服务器端，我编写了代码来执行所有搜索/过滤/排序。

我的 jqGrid 有一个 filterToolbar 和一个搜索按钮。

不幸的是，当我搜索时，我为日期选择的值没有在请求中发送。然而，奇怪的是，当它是 filterToolbar 的选定日期时它会发送它？！？

为什么这里没有数据？

{"groupOp":"AND","rules":[{"field":"RunDate","op":"le","data":""}]}

这是我的网格代码。

var loadFileInfoList = function (fileInfoList, pager) {
    fileInfoList.jqGrid({
        url: 'GetFiles',
        datatype: 'json',
        mtype: 'POST',
        colNames: ['Id', 'Name', 'Interface', 'Amount', 'Type', 'Created', 'Status'],
        colModel: [
                { jsonmap: 'Id', name: 'Id', formatter: 'integer', align: 'right', hidden: true },
                { jsonmap: 'Name', name: 'Name', align: 'right', hidden: true },
                { jsonmap: 'InterfaceName', name: 'InterfaceName', align: 'left', width: '100%', sorttype: 'text', frozen: true,
                    search: true,
                    searchoptions: {
                        sopt: ['cn']
                    }
                },
                { jsonmap: 'Amount', name: 'Amount', formatter: 'currency', align: 'right', width: '100%', sorttype: 'number',
                    search: true,
                    searchoptions: {
                        sopt: ['ge', 'le']
                    }
                },
                { jsonmap: 'Type', name: 'Type', align: 'right', width: '100%', sorttype: 'text',
                    search: true, stype: 'select',
                    searchoptions: {
                        value: getTypeFilterOptions(),
                        sopt: ['eq']
                    }
                },
                { jsonmap: 'RunDate', name: 'RunDate', formatter: 'date', align: 'right', width: '100%', sorttype: 'date',
                    search: true,
                    datefmt: 'dd/mm/yyyy',
                    searchrules: {
                        date: true
                    },
                    searchoptions: {
                        sopt: ['ge', 'le'],
                        dataInit: function (elem) {
                            $(elem).datepicker({
                                dateFormat: 'dd/mm/yy',
                                changeYear: true,
                                changeMonth: true,
                                showButtonPanel: true,
                                onSelect: function () {
                                    $(this).keydown();
                                }
                            });
                        }
                    }
                },
                { jsonmap: 'Status', name: 'Status', align: 'right', width: '100%', sorttype: 'text', formatter: formatStatus,
                    search: true, stype: 'select',
                    searchoptions: {
                        value: getStatusFilterOptions(),
                        sopt: ['eq']
                    }
                }
            ],
        autoencode: true,
        sortname: 'RunDate',
        sortorder: 'desc',
        pager: pager,
        rowNum: 5,
        viewrecords: true,
        height: '100%',
        autowidth: true,
        ignoreCase: true,
        jsonReader: {
            repeatitems: false,
            root: "rows"
        },
        altRows: true,
        altclass: 'jqGridAltRow',
        loadComplete: function () {
            $("tr.jqgrow:odd").addClass('jqGridAltRow');
        }
    });

    fileInfoList.jqGrid('navGrid', pager,
        { edit: false, add: false, del: false },
        {},
        {},
        {},
        { closeOnEscape: true, closeAfterSearch: true, multipleSearch: true, multipleGroup: false }
    );

    fileInfoList.jqGrid('filterToolbar', { searchOnEnter: false, enableClear: true, stringResult: true });
};

loadFileInfoList($('#jqgFileInfoList'), '#jqgPagerFileInfoList');

Answer 1

我想你可以通过更改 datepicker 的 onSelect 回调来解决问题。你可以改变

onSelect: function () {
    $(this).keydown();
}

到

onSelect: function () {
    $(this).trigger('change');
}

您还可以使用我在the answer 中发布的更复杂的构造，或者来自here 的更简单的形式。