col width is using in jqgrid, working perfectly in chrome but not working in mozilla 33.0 version

Question

I am using following for jqgrid, it is working perfectly in jqgrid, but it is not displaying in mozilla 33.0 what is showing in chrome.

Answer 1

First of all: you use wrong HTML markup in your demo:

<table id="list_records"><div id="perpage"></div></table>

should be fixed to

<table id="list_records"></table><div id="perpage"></div>

Seconds you permanently use index values different as name value ({name:'FirmWare',index:'name'} for example). I strictly recommend you to remove all index properties from colModel. Usage of index values which values are not the same as name value of the grid break sorting in the column.

Third: Even after installing Mozilla Firefox 33.0 beta 5 on my computer (Windows 7) I can't reproduce your problem: the width of all columns seems be correct after the loading. If I sort by the last column in Asc or Desc direction I get correct width value for all columns too.

UPDATED: It seems to me that the code which implement setting of width of columns based on the max column contain should be fixed by adding if (cm.hidden) { continue; } after the line cm = colModel[iCol];:

$("#list1").on("jqGridAfterLoadComplete jqGridRemapColumns", function () {
    var $this = $(this),
        $cells = $this.find(">tbody>tr>td"),
        $colHeaders = $this.closest(".ui-jqgrid-view").find(">.ui-jqgrid-hdiv>.ui-jqgrid-hbox>.ui-jqgrid-htable>thead>.ui-jqgrid-labels>.ui-th-column>div"),
        colModel = $this.jqGrid("getGridParam", "colModel"),
        iCol,
        iRow,
        rows,
        row,
        n = $.isArray(colModel) ? colModel.length : 0,
        cm,
        colWidth,
        idColHeadPrexif = "jqgh_" + this.id + "_";
    $cells.wrapInner("<span class='mywrapping'></span>");
    $colHeaders.wrapInner("<span class='mywrapping'></span>");

    for (iCol = 0; iCol < n; iCol++) {
        cm = colModel[iCol];
        if (cm.hidden) {
            continue;
        }
        colWidth = $("#" + idColHeadPrexif + $.jgrid.jqID(cm.name) + ">.mywrapping").outerWidth() + 25; // 25px for sorting icons
        for (iRow = 0, rows = this.rows; iRow < rows.length; iRow++) {
            row = rows[iRow];
            if ($(row).hasClass("jqgrow")) {
                colWidth = Math.max(colWidth, $(row.cells[iCol]).find(".mywrapping").outerWidth());
            }
        }
        $this.jqGrid("setColWidth", iCol, colWidth);
    }
});

see the demo.