Search and Filtering in TreeGrid

TreeGrid supports filtering. You can set search box, text or select filters for each column.

By ( affect filters only )

THIS PAGE CONTAINS SAMPLE FUNCTIONALITY OF PROFESSIONAL EDITION FOR DEMONSTRATION PURPOSE ONLY.
UNAUTHORIZED USE IS PROHIBITED. PLEASE CONTACT SALES@DHTMLX.COM TO OBTAIN A LEGAL COPY OF PROFESSIONAL EDITION.

Source

<link rel="STYLESHEET" type="text/css" href="../../../dhtmlxGrid/codebase/dhtmlxgrid.css">
<link rel="stylesheet" type="text/css" href="../../../dhtmlxGrid/codebase/skins/dhtmlxgrid_dhx_skyblue.css">
<script  src="../../../dhtmlxGrid/codebase/dhtmlxcommon.js"></script>
<script  src="../../../dhtmlxGrid/codebase/dhtmlxgrid.js"></script>
<script  src="../../../dhtmlxGrid/codebase/dhtmlxgridcell.js"></script>
<script  src="../../codebase/dhtmlxtreegrid.js"></script>
<script src="../../../dhtmlxGrid/codebase/ext/dhtmlxgrid_filter.js" type="text/javascript"></script>
<script src="../../codebase/ext/dhtmlxtreegrid_filter.js" type="text/javascript"></script>
<style>
div.gridbox div.ftr td{
    text-align:right;
}
div.gridbox table.hdr td {
    font-weight:bold;
}
</style>
 
 
 
 
By <select onchange="mygrid.setFiltrationLevel(this.value)"><option value="-1" selected="true">last level<option value="1">second level</select> ( affect filters only )
<table width="550">
    <tr>
        <td>
            <div id="gridbox" width="100%" height="327px" style="background-color:white;"></div>
        </td>
    </tr>
</table>
<script>mygrid = new dhtmlXGridObject('gridbox');
mygrid.setImagePath("../../../dhtmlxGrid/codebase/imgs/icons_books/");
mygrid.setHeader("Search, Text Filter, Select Filter");
mygrid.attachHeader("#text_search,#text_filter,#select_filter");
mygrid.setInitWidths("300,120,*");
mygrid.setColAlign("left,right,right");
mygrid.setColTypes("tree,price,ed");
mygrid.setColSorting("str,int,int");
mygrid.init();
mygrid.setSkin("dhx_skyblue");
mygrid.loadXML("../common/treegrid_sample1.xml");</script>