Is there a way to customize search rules in jqGrid

问题:

I have 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']}
                }]
   //.......
        });

Is there a way to set "odata" option in "Date" column. Now it's showing "greater" and "less". I need - "from" and "to".

I try this :

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

It's not working, still showing "greater" and "less". Tried this :

$(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);
});

It's replaces "greater" to "from" and "less" to "to" in all columns, but I need only in "Date" column. Is there a way to do it?

Thanks.

回答1:

I had a similar problem and ended up solving it by editing some of the jqGrid source code.

I added additional operators to the ops array. (It was line 6130 in version 4.4.0.)

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'],

Use these new options in the sopt parameter in your date column specification. (You may also need to adjust the back end to translate these operators depending on your search results implementation.)

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

Hope this helps.

回答2:

To use searching in jqGrid you call probably navGrid function to add navigator with the search button. The function navGrid has as the 6-th parameter an object (see http://www.trirand.com/jqgridwiki/doku.php?id=wiki:navigator#definition) which can be used to overwrite any default parameters from $.jgrid.search inclusive odata parameter. So you can do something like following

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']});

回答3:

1. jqGrid Version 4.5.4
2. JQuery Version 1.9.0 (included in jqGrid Zip File)
3. Chrome Version 31.0.1650.48 m

There is a Problem in Jquery 1.9/1.10 with Chrome 31.x : event.returnValue is deprecated. Please use the standard event.preventDefault() instead. http://bugs.jquery.com/ticket/14320

Replace the following code (JQuery 2.x version) => remove 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;

can work for me