有没有办法在特定列中自定义 jqGrid 中的搜索规则？答案

【问题标题】：Is there a way to customize search rules in jqGrid in particular column?有没有办法在特定列中自定义 jqGrid 中的搜索规则？
【发布时间】：2010-07-23 07:55:03
【问题描述】：

我有 jqgrid：

    jQuery("#list").jqGrid( {
            url : 'ajax/get',
            datatype : 'json',
            mtype : 'POST',
            colNames : [
                'Date',
                'ID'
            ],
            colModel : [{
                    name : 'date',
                    index : 'date',
                    width : 60,
              align : 'center',
                    searchoptions:{sopt:['gt', 'lt']}
                },{
                    name : 'id',
                    index : 'id',
                    width : 40,
              align : 'center',
                    searchoptions:{sopt:['eq']}
                }]
   //.......
        });

有没有办法在“日期”列中设置“odata”选项。现在它显示“更大”和“更少”。我需要 - “从”和“到”。

我试试这个：

colModel : [{
                    name : 'date',
                    index : 'date',
                    width : 60,
                    align : 'center',
                    searchoptions:{sopt:['gt', 'lt'], odata:['from', 'to']}
                }

它不起作用，仍然显示“更大”和“更少”。试过这个：

$(document).ready(function(){
  $.jgrid.search = {
    odata : ['equal','not equal', 'to', 'less or equal','from','greater or equal', 'begins with','does not begin with','is in','is not in','ends with','does not end with','contains','does not contain']
  };
  $.extend($.jgrid.search);
});

它在所有列中将“大于”替换为“从”，将“小于”替换为“到”，但我只需要在“日期”列中。有办法吗？

谢谢。

【问题讨论】：

标签： javascript jquery search jqgrid odata

【解决方案1】：

我遇到了类似的问题，最后通过编辑一些 jqGrid 源代码解决了它。

我在 ops 数组中添加了额外的运算符。（在 4.4.0 版本中是第 6130 行。）

ops : [
    {"name": "eq", "description": "equal", "operator":"="},
    {"name": "ne", "description": "not equal", "operator":"<>"},
    {"name": "lt", "description": "less", "operator":"<"},
    {"name": "le", "description": "less or equal","operator":"<="},
    {"name": "gt", "description": "greater", "operator":">"},
    {"name": "ge", "description": "greater or equal", "operator":">="},
    {"name": "bw", "description": "begins with", "operator":"LIKE"},
    {"name": "bn", "description": "does not begin with", "operator":"NOT LIKE"},
    {"name": "in", "description": "in", "operator":"IN"},
    {"name": "ni", "description": "not in", "operator":"NOT IN"},
    {"name": "ew", "description": "ends with", "operator":"LIKE"},
    {"name": "en", "description": "does not end with", "operator":"NOT LIKE"},
    {"name": "cn", "description": "contains", "operator":"LIKE"},
    {"name": "nc", "description": "does not contain", "operator":"NOT LIKE"},
    {"name": "nu", "description": "is null", "operator":"IS NULL"},
    {"name": "nn", "description": "is not null", "operator":"IS NOT NULL"},
    {"name": "to", "description": "to", "operator":"<"},
    {"name": "fr", "description": "from", "operator":">"}
    ],
numopts :  
    ['eq','ne','lt','le','gt','ge','nu','nn','in','ni'],
stropts :
    ['eq','ne','bw','bn','ew','en','cn','nc','nu','nn','in', 'ni','to','fr'],

在日期列规范的 sopt 参数中使用这些新选项。（根据您的搜索结果实现，您可能还需要调整后端以翻译这些运算符。）

{name:'mydatefield', searchoptions: {sopt:['to', 'fr']}}

希望这会有所帮助。

【讨论】：

【解决方案2】：

要在 jqGrid 中使用搜索，您可能调用 navGrid 函数来添加带有搜索按钮的导航器。函数navGrid 具有作为第6 个参数的对象（请参阅http://www.trirand.com/jqgridwiki/doku.php?id=wiki:navigator#definition），该对象可用于覆盖$.jgrid.search（包括odata 参数）中的任何默认参数。因此，您可以执行以下操作

jQuery("#list").jqGrid('navGrid','#pager',{search:true},{},{},{},
                {odata:['equal','not equal', 'to', 'less or equal','from',
                        'greater or equal', 'begins with','does not begin with',
                        'is in','is not in','ends with','does not end with',
                        'contains','does not contain']});

【讨论】：

它不工作。规则不变。尽管如此，我认为这段代码也将替换全局 $.jqgrid.search，但我只需要在“日期”列中。
您最好在写评论之前测试您的代码。查看ok-soft-gmbh.com/jqGrid/ClientsideEditing3.htm的源码，双击修改数据，尝试搜索“Group”字段的“Name”。一切正常。 navGrid 的参数导致不要覆盖来自 $.jqgrid.search 的全局设置。

【解决方案3】：

jqGrid 版本 4.5.4
JQuery 版本 1.9.0（包含在 jqGrid Zip 文件中）
Chrome 版本 31.0.1650.48 m

在带有 Chrome 31.x 的 Jquery 1.9/1.10 中存在一个问题：不推荐使用 event.returnValue。请改用标准 event.preventDefault()。 http://bugs.jquery.com/ticket/14320

替换以下代码（JQuery 2.x 版本）=> 删除 src.returnValue

    // Events bubbling up the document may have been marked as prevented
    // by a handler lower down the tree; reflect the correct value.
    this.isDefaultPrevented = (src.defaultPrevented ||
    src.getPreventDefault && src.getPreventDefault()) ? returnTrue : returnFalse;

可以为我工作

【讨论】：