The following code has two issues:
the call to attachHeader has no effect - does not add the column filters. However, surprisingly, it shows up as soon as the user navigates to the second page.
Second, binding 1000 rows takes 6 seconds.
I bought this control for its column filter capability.
mygrid = new dhtmlXGridObject('myTable');
mygrid.setImagePath("/inc/js/scripts_grid/imgs/");
mygrid.setHeader("Org, Type, Numb, Updated By");
mygrid.setInitWidths("250,150,100,100");
mygrid.enableAutoWidth(true);
mygrid.setColTypes("ro,ro,ro,ro");
mygrid.setColSorting("str,str,str,str");
mygrid.enableStableSorting(true);
mygrid.enablePaging(true, 15, 10, "pgr", true, "pgrstate");
mygrid.init();
mygrid.enableHeaderMenu();
mygrid.setSkin("dhx_skyblue");
function bindResults(obj) {
console.log("Bind", new Date());
mygrid.detachHeader(1);
mygrid.clearAll();
console.log("Cleared", new Date());
$.each(obj.response.docs, function () {
mygrid.addRow(this._ID, [this._NAME, this._DESC, this._IDN, this.LNAME + ", " + this.FNAME]);
console.log("Bind complete", new Date());
});
console.log("Bind complete", new Date());
mygrid.attachHeader("#text_search,#select_filter, ,#select_filter");
console.log("Attached headers", new Date());
}