CODEWITHSUNDEEP
jquerysearchjqgrid
Damilare Binutu
Damilare Binutu

Reputation: 151

Set custom search options in JQGrid

Please take a look at this image. Search

In the drop down list is a collection of search options. What I want is to trim these options down to only equal and not equal. I do not want the other options showing. I have tried to do but it does not work. Any help appreciated.

navGrid("#pager", {search:true, edit:false,add:false,del:false,searchtext:"Search",refreshtext:"Refresh" },
                  {sopt: ['eq','ne']}      
       );

Upvotes: 1

Views: 16517

Answers (3)

UdayKiran Pulipati
UdayKiran Pulipati

Reputation: 6667

Add this sopt:['eq','ne'] condition for filter search options in jqgrid.

Total available search options in jqgrid is

sopt:['eq','ne','lt','le','gt','ge','bw','bn','in','ni','ew','en','cn','nc']

Replace Below Code:

$("#listCountry").jqGrid('navGrid','#pagerDiv',
{edit:false,add:false,del:false},{},{},{},{sopt:['eq','ne']});

Script:

$(document).ready(function(){

    //jqGrid
    $("#listCountry").jqGrid({
        url:'<%=request.getContextPath()%>/Admin/getCountriesList',
        datatype: "json",           
        colNames:['Edit','Country Code','Country Name','Active'],
        colModel:[                  
            {name:'countryId',search:false, index:'countryId', width:30,sortable: false, formatter: editLink},                  
            {name:'countryCode',index:'countryCode', width:100},
            {name:'countryName',index:'countryName',width:250}, 
            {name:'isActive',index:'isActive',width:80},
            ],
            rowNum:20,
            rowList:[10,20,30,40,50],
            rownumbers: true,  
            pager: '#pagerDiv', headertitles:true,
            sortname: 'countryName',  
            viewrecords: true,  
            sortorder: "asc",              
    });
    $('#gridContainer div:not(.ui-jqgrid-titlebar)').width("100%");
    $('.ui-jqgrid-bdiv').css('height', window.innerHeight * .65);                   
    $('#load_listCountry').width("130");    
    $("#listCountry").jqGrid('navGrid','#pagerDiv',{edit:false,add:false,del:false},{},{},{},{sopt:['eq','ne']});
    $(".inline").colorbox({inline:true, width:"20%"});
});

function editLink(cellValue, options, rowdata, action) {
    return "<a href='<%=request.getContextPath()%>/Admin/addCountry/"+ rowdata.countryId + "' title='Edit' class='ui-icon ui-icon-pencil' ></a>";
}

HTML

<div id="gridContainer">
    <table id="listCountry"></table>
    <div id="pagerDiv"></div>
</div>

Upvotes: 0

Hemant Singh
Hemant Singh

Reputation: 167

 jQuery("#dataTable").jqGrid('navGrid','#pagingDiv',
            {
                search:true,
                edit:false,
                add:false,
                del:false
            },
            {},
            {},
            {},
            {
                multipleSearch:false, multipleGroup:false, showQuery: false,
                sopt: ['eq', 'ne', 'cn', 'nc', 'bw', 'ew'],
                defaultSearch: 'cn'
                //optDescriptions: {eq:'my eq', gt:'after', le:'on or before'}
            }

            );

Upvotes: 1

ojovirtual
ojovirtual

Reputation: 3362

Based on this (link)

navGrid("#pager", 
{
    search:true, 
    edit:false,
    add:false,
    del:false,
    searchtext:"Search",
    refreshtext:"Refresh",
    searchoptions:{
                      sopt: ['eq','ne']
                  }
});

Upvotes: 0

Related Questions