グリッドの列単位フィルタ

Question

各列のドロップダウンメニューにフィルタを置くのではなく、ヘッダーラベルとデータをag-gridで表示するにはどうすればよいですか？その上

Answer 1

最良のオプションはHeader Templateを使用して、そこに入力を含めることであろう。また、gridOptions内のヘッダーの高さを増やす必要があります。

var gridOptions = { 
    ... 
    headerHeight: 150, // make this as tall as you need... 
    headerCellTemplate: HEADER_CELL_TEMPLATE, // I chose to name template vars in all caps 
    ... 
} 

var HEADER_CELL_TEMPLATE = '<div class="ag-header-cell">' + 
    '<div id="agResizeBar" class="ag-header-cell-resize"></div>' + 
    '<span id="agMenu" class="ag-header-icon ag-header-cell-menu-button"></span>' + 
    '<div id="agHeaderCellLabel" class="ag-header-cell-label">' + 
     '<span id="agSortAsc" class="ag-header-icon ag-sort-ascending-icon"></span>' + 
     '<span id="agSortDesc" class="ag-header-icon ag-sort-descending-icon"></span>' + 
     '<span id="agNoSort" class="ag-header-icon ag-sort-none-icon"></span>' + 
     '<span id="agFilter" class="ag-header-icon ag-filter-icon"></span>' + 
     '<span id="agText" class="ag-header-cell-text"></span>' + 
    '</div>' + 
    '<input type="text" ></input>' + 
'</div>' 

Answer 2

としてもこれに近い何かをするグリッドの設定のためのfloatingFilterオプションもあります：私はいくつかの設定パラメータを逃したと思っているだろう

gridOptions = { 
    // turn on floating filters 
    floatingFilter: true 
    ... 
}