jqgridの各列にフィルターを追加する

Question

私は従業員の詳細を示すjqgridを持っています。ユーザーが会社名で入力できるフィルターを各列に追加したいと考えています。フィルタをグリッド内に配置します。

グーグルでは大丈夫ですが、成功しません。すべてのrefrenceの例/リンクが役立ちます。

Answer 1

あなたは、あなたのデータがレコードをfiterますテキストボックスにテストケースの名前を入力するときは、filterToolbarオプションを使用する必要があり、ここでは、コードとあなたがチェックしたexample demo

var mydata = [ 
    {id:"1",invdate:"2010-05-24",name:"test",note:"note",tax:"10.00",total:"2111.00"} , 
    {id:"2",invdate:"2010-05-25",name:"test2",note:"note2",tax:"20.00",total:"320.00"}, 
    {id:"3",invdate:"2007-09-01",name:"test3",note:"note3",tax:"30.00",total:"430.00"}, 
    {id:"4",invdate:"2007-10-04",name:"blah",note:"stuff",tax:"10.00",total:"210.00"}, 

]; 
jQuery("#list").jqGrid({ 
data: mydata, 
datatype: "local", 
height: 150, 
rowNum: 10, 
rowList: [10,20,30], 
    colNames:['Inv No','Date', 'Client', 'Amount','Tax','Total','Notes'], 
    colModel:[ 
     {name:'id',index:'id', width:60, sorttype:"int"}, 
     {name:'invdate',index:'invdate', width:90, sorttype:"date", formatter:"date"}, 
     {name:'name',index:'name', width:100}, 
     {name:'amount',index:'amount', width:80, align:"right",sorttype:"float", formatter:"number"}, 
     {name:'tax',index:'tax', width:80, align:"right",sorttype:"float"},   
     {name:'total',index:'total', width:80,align:"right",sorttype:"float"},   
     {name:'note',index:'note', width:150, sortable:false}   
    ], 
    pager: "#pager", 
    viewrecords: true, 
    autowidth: true, 
    height: 'auto', 
    caption: "Test Grid" 
}); 

jQuery("#list").jqGrid('filterToolbar', { stringResult: true, searchOnEnter: false, defaultSearch: "cn" }); 



<table id="list"></table> 
<div id="pager"></div>