jqGrid filter or search by date not working client side

Question

I have an ASP.NET MVC 3 page. On it, I have a table which I turn into a jqGrid using JSON data from an ajax call. The grid has the following setup:

myGrid = $('#myGrid');
myGrid.jqGrid({
    caption: 'My Grid',
    datatype: 'local',
    data: data.rows,
    height: 250,
    pager: '#myPager',
    viewrecords: true,
    colModel: [
        ...,
        {
            label: 'blah',
            name: 'blah',
            align: 'left',
            sortable: true,
            editable: false,
            width: 85,
            formatter: 'date',
            sorttype: 'date',
            datefmt: 'm/d/Y',
            formatoptions: { srcformat: 'm/d/Y', newformat: 'm/d/Y' }
        },
        ...
    ]
});

// turn on filter toolbar
myGrid.filterToolbar();

data.rows is returned from the ajax call. This works in all ways except one. I can paginate client-side, sort client side, and search by every field except the one I show the colModel for. This 'blah' field is a date field, and it displays the dates correctly, in mm/dd/yyyy format. However, when I type in something like 11/17/2010 into the toolbar and press enter, the search returns 0 records.

So I dug deep into the jqGrid code, and here's what it generates before it searches:

{"groupOp":"AND","rules":[{"field":"blah","op":"bw","data":"11/17/2010"}]}

Eventually, when it goes through every row and it evaluates the operation on the field, the eval(m) && p.push(this) line, m is this:

(String(this.blah).substr(0,10) == String("11/17/2010"))

Basically, it looks to me like it's not recognizing that the field is a date. It calls parse instead of parseDate. Anybody have any ideas how to fix this? I know searching server side is easy, I can just pass that string, parse it, and bam. But I'd like to stay client side if I can. I was able to duplicate this in some of the samples that Oleg and Tom put up, so it's either an issue or I'm missing something in the configuration...

Answer 1

I find your question interesting so +1 from me to your question. Because you posted the line

(String(this.blah).substr(0,10) == String("11/17/2010"))

used in eval during the local searching I suppose you spend much time to understand how the local searching are implemented. Because you see that the line above (see (String(this.blah).substr(0,10) ...) is not what should be done (the value of String(this.blah) will be "2010-11-17" instead of "11/17/2010"), you can overwrite the corresponding function of jqGrid (the function _getStr inside of $.jgrid.from) and fix the problem in the way.

Some time ago I spend much time to prepare the corresponding the demo, which demonstrates this technique. The demo was prepared as the answer in trirand forum. In the question one wanted to find strings like 'bénevise' in case of searching for 'benevise'. So one have to implement really custom local searching. I hope that the information will be enough for you to fix the problem which you describe.

UPDATED: It seems to me that I have found a much more simple workaround. You should just define searchoptions: {sopt: ['eq','ne']} for the 'blah' column having the data. Then "bw" (begin with) will not used for the column. The "equal to" and "not equal to" operations work correctly in the local searching.

UPDATED 2: Here is the working example where I use sopt option.