sorting - jqGrid place sort arrow icon on the left -
sorting - jqGrid place sort arrow icon on the left -
how can place sort arrow icon on left in filter headers?
i see problem implementation because arrows container (s-ico) within container header (ui-jqgrid-sortable) ...
<div id="jqgh_mylist_pdate" class="ui-jqgrid-sortable"> date <span class="s-ico"> <span sort="asc" class="ui-grid-ico-sort ui-icon-asc ui-state-disabled ui-icon ui-icon-triangle-1-n ui-sort-ltr"></span> <span sort="desc" class="ui-grid-ico-sort ui-icon-desc ui-icon ui-icon-triangle-1-s ui-sort-ltr"></span> </span> </div>
a long time seek find reply question , made own solution
difference between sortable , not sortable columns in style in first span tag - display:none
in begin tried observe sortable columns utilize :hidden selector, columns have blank spans , selector homecoming true both type of columns
<!-- sortable --> <div id="jqgh_manager" class="ui-jqgrid-sortable"> manager <span class="s-ico"> <span sort="asc" class="ui-grid-ico-sort ui-icon-asc ui-state-disabled ui-icon ui-icon-triangle-1-n ui-sort-ltr"></span> <span sort="desc" class="ui-grid-ico-sort ui-icon-desc ui-state-disabled ui-icon ui-icon-triangle-1-s ui-sort-ltr"></span> </span> </div> <!-- not sortable --> <div id="jqgh_operator" class="ui-jqgrid-sortable"> operator <span class="s-ico" style="display:none"> <span sort="asc" class="ui-grid-ico-sort ui-icon-asc ui-state-disabled ui-icon ui-icon-triangle-1-n ui-sort-ltr"></span> <span sort="desc" class="ui-grid-ico-sort ui-icon-desc ui-state-disabled ui-icon ui-icon-triangle-1-s ui-sort-ltr"></span> </span> </div>
so, can check rule of style span tag
// moving arrows of sorting left side jquery.jgrid.extend({ movesortarrows: function (){ // moving sorted cols // must check style rule, because can not utilize :hidden selector since selector // homecoming true if width , height equal 0 // more info see official documentations - http://api.jquery.com/hidden-selector/ $('.ui-jqgrid-sortable:has(span.s-ico:not([style*="display:none"]))').each( function() { // add together left padding moving arrows $(this).css('padding-left', '16px'); // moving arrows $(this).find('span.s-ico').css({ "position": "absolute", "left": 0 }); } ); } });
sorting jqgrid
Comments
Post a Comment