Start Building Professional
Web Apps Today

Sorting indicators/arrows in a header on multiple columns (dhtmlx grid)

It would be nice to have sorting indicators/arrows in a header on multiple columns. This would show users that these columns are sortable. To my understanding, it is NOT possible to enable that functionality with standard function setSortImgState(x,y,z) as it sets up image and sorting state for one column only.
My plan is to set up custom onHeaderClick or onBeforeSorting event handler and use complex header:

mygrid.setHeader("Header0,Header1,<div>Sortable Header</div><div><img id=\"hdr2img\" src=\"images/arrow_up.gif\"/></div>,Header3");

In the body of my event handler I can find "hdr2img" object and replace image src with "images/arrow_down.gif". Is this the best solution to this problem ? Could you recommend anything else or do you plan to include such functionality in a future release of dhtmlx grid ?

>>Could you recommend anything else or do you plan to include such functionality in a future release of dhtmlx grid ?
The multi-column sorting is rare used functionality so we not plan to include support of multiple sorting markers ( at least not in next version of grid )

>>My plan is to set up custom onHeaderClick or onBeforeSorting
The best will be to use onBeforeSorting event it, occurs exactly before sorting and have all necessary info ( column index and sorting direction )


mygrid.attachEvent("onBeforeSorting",function(ind,grid,order){
    mygrid.setColumnLabel(ind, mygrid.getColumnLabel(ind).replace(/arrow_(asc|des)/, order) );
    return true;
});