CODEWITHSUNDEEP
javascriptajaxjqueryjqgrid
DeepVeen
DeepVeen

Reputation: 311

Jqgrid search option for local datatype not working

I want to add search option for my jqgrid table, 

$('#jqgrid').jqGrid({
    datatype: 'local',
    data: mydata,
    caption: 'Titlepage Parameters',
    gridview: true,
    height: 'auto',
    colNames: ['title', 'color', 'fontsize'],
    colModel: [
        {name: 'config.titlepage.title' },
        {name: 'config.titlepage.color' },
        {name: 'config.titlepage.fontsize' },
    ],
    pager: '#pageGrid'
    localReader: {
        id: "_id.$oid"
    }
});
$('#jqgrid').jqGrid('navGrid', "#pageGrid",
    { search: true, edit: false, add: false, del: false, refresh: false }, {}, {},
    { recreateFilter: true, overlay: true, multipleSearch: true, multipleGroup: true});

I'm getting the search option but when I enter the search string and click on Filter button, search is happening.

Please help me here, do I need add any library files to perform for this search filter?

Upvotes: 2

Views: 4841

Answers (1)

Oleg
Oleg

Reputation: 221997

I'm not sure which problem with searching you have. The only clear error is: you skip one {} in the list of navGrid. You current option of navGrid set delete options as searching options. Correct option will be

$('#jqgrid').jqGrid('navGrid', "#pageGrid",
    { search: true, edit: false, add: false, del: false, refresh: false }, {}, {}, {},
    { recreateFilter: true, overlay: true, multipleSearch: true, multipleGroup: true});

Additionally you can consider to add ignoreCase: true option to the grid to make searching case insensitive. The demo seems to work correctly.

Another option which you can use to read the same data: to use datatype: 'jsonstring'. In the case you can use jsonmap and choose more readable name property. In the case the internal data of grid will contains only the data which you need. The demo demonstrate this approach. It uses the following code

var mydata = [
        {
          "_id": {"$oid": "50a3f962b7718da1a3090fa9"},
          "config": { "titlepage": { "title": "My First Title", "color": true,
                                     "fontsize": "42/44" } } }
    ];

$('#jqgrid').jqGrid({
    datatype: 'jsonstring',
    datastr: mydata,
    caption: 'Titlepage Parameters',
    gridview: true,
    height: 'auto',
    colModel: [
        {name: 'title',    jsonmap: "config.titlepage.title" },
        {name: 'color',    jsonmap: "config.titlepage.color" },
        {name: 'fontsize', jsonmap: "config.titlepage.fontsize" },
    ],
    pager: '#pageGrid',
    jsonReader: {
        repeatitems: false,
        id: "_id.$oid"
    }
});
$('#jqgrid').jqGrid('navGrid', "#pageGrid",
    { search: true, edit: false, add: false, del: false, refresh: false }, {}, {}, {},
    { recreateFilter: true, overlay: true, multipleSearch: true, multipleGroup: true});

In any way I don't see any problem with searching in both demos.

Upvotes: 2

Related Questions