Tony,
My approach was to toggle multi-sorting mode off and on via a check box in the pager bar… this implementation may not suit everybody.
Also there was no attempt to include a visual indicator in the column headers, (perhaps a sort index number or color-coded sort glyph etc).
Cheers,
Keith.
(A.K.A Rat)
Got it working (missed div). Thanks.
kobruleht said:
It sets column width to very small. After that also column cannot resized.
Really?
Here's some fully working code… its a bit messy but functional. I adapted it from the jqGrid's dragEnd event handler.
jQuery('span.ui-jqgrid-resize').dblclick(function ()
{
var id = jQuery(this).parent().attr('id'); // First get the ID of the column that this separator belongs to. This is a tag with an ID for the column.
var colName = id.split('_')[1];
var testDiv = jQuery('#stringWidth'); // Test DIV for measuring string widths
testDiv.addClass('ui-jqgrid ui-jqgrid-htable ui-jqgrid-sortable ui-th-column ui-state-hover ui-widget-content ui-widget-header ui-state-focus'); // Assign jqGrid header style classes
var padding = parseInt(jQuery(jQuery(this).parent()).css('padding-left')) + parseInt(jQuery(jQuery(this).parent()).css('padding-right')); // Calculate jqGrid header padding
testDiv.html(jQuery(jQuery(this).parent()).html()); // Assign jqGrid header text to test DIV
var nw = testDiv.width() + padding; // Calculate jqGrid header text width
testDiv.removeClass('ui-jqgrid ui-jqgrid-htable ui-jqgrid-sortable ui-th-column ui-state-hover ui-widget-content ui-widget-header ui-state-focus'); // De-assign jqGrid header style classes
testDiv.addClass('ui-jqgrid ui-row-ltr jqgrow ui-widget-content'); // Assign jqGrid cell style classes
jQuery.each (jQuery('td[aria-describedby=' + id + ']'), function() // Iterate over all of the rows and figure out which row is the widest.
{
padding = parseInt(jQuery(this).css('padding-left')) + parseInt(jQuery(this).css('padding-right')); // Calculate jqGrid cell padding
testDiv.html(jQuery(this).html()); // Assign jqGrid cell text to test DIV
w = testDiv.width() + padding; // Calculate jqGrid cell text width
if (w > nw) {nw = w;}
});
// Code below adapted from the grid's “dragEnd” event handler
var ts = jQuery('#grid')[0];
var grid = ts.grid;
var p = ts.p;
var idx = jQuery.jgrid.getCellIndex(jQuery(this).parent());
jQuery(“#rs_m”+jQuery.jgrid.jqID(p.id)).css(“display”,”none”);
p.colModel[idx].width = nw;
grid.headers[idx].width = nw;
grid.headers[idx].el.style.width = nw + “px”;
grid.cols[idx].style.width = nw+”px”;
if(grid.footers.length>0) {grid.footers[idx].style.width = nw+”px”;}
if(p.forceFit===true)
{
nw = grid.headers[idx+p.nv].newWidth || grid.headers[idx+p.nv].width;
grid.headers[idx+p.nv].width = nw;
grid.headers[idx+p.nv].el.style.width = nw + “px”;
grid.cols[idx+p.nv].style.width = nw+”px”;
if(grid.footers.length>0) {grid.footers[idx+p.nv].style.width = nw+”px”;}
p.colModel[idx+p.nv].width = nw;
}
else
{
jQuery('table:first',grid.bDiv).css(“width”,p.tblwidth+”px”);
jQuery('table:first',grid.hDiv).css(“width”,p.tblwidth+”px”);
grid.hDiv.scrollLeft = grid.bDiv.scrollLeft;
if(p.footerrow)
{
jQuery('table:first',grid.sDiv).css(“width”,p.tblwidth+”px”);
grid.sDiv.scrollLeft = grid.bDiv.scrollLeft;
}
}
});
Copyright 2014 TriRand LtdAll Rights ReservedRSS
Back to Top