Changing the column position of rownumber property in JQgrid

Question

I have enabled 'rownumber' property. So it is displaying row numbers by inserting a row in left most . So first column is displaying row numbers. ButI want to display row numbers in between i.e. in 3rd column.

Is there is any way to change column position?

I posted **UPDATED** part to my answer with [the demo](http://www.ok-soft-gmbh.com/jqGrid/customRowNumberColumn.htm) to show how to implement custom column which looks exactly like `"rn"` column added by jqGrid in case of `rownumbers: true`. You can "play" with it by changing the current page number or the number of rows per page. It displays always the same values as in `"rn"` column. — Oleg, Sep 10 '14 at 14:44

score 0 · Accepted Answer · edited May 23 '17 at 12:05

Some columns of jqGrid have special meaning and will be created by jqGrid depend of the options which you use. It's "rn" (rownumbers: true), "cb" (multiselect: true) and subgrid (subGrid: true). See for example the line of code. Many parts of jqGrid code just test the options and then uses the indexes of columns based on the assumption that the columns are the first columns in jqGrid. So it's probably theoretically possible to write the code which could move the original "rn" column to another position, but the code will be very tricky and probably long. Look at the demo of the answer for example.

So I would recommend you just add your custom column to the grid which looks like "rn" column and fill it with the corresponding data. The column definition could be like below

{ name: "myRowNumbern", width:25, sortable: false, resizable: false, hidedlg: true,
    search: false, align: "center", fixed: true,
    classes: "ui-state-default jqgrid-rownum" }

UPDATED: I created the demo which demonstrates the approach. The most important parts of the corresponding code is below:

$("#list").jqGrid({
    curRowNum: 1, // current row number parameter used in custom formatter
    colModel: [
        ...
        { name: "myRowNumbern", width: 25, sortable: false, resizable: false,
          hidedlg: true, search: false, align: "center", fixed: true,
          classes: "ui-state-default jqgrid-rownum",
          formatter: function () {
              var p = $(this).jqGrid("getGridParam"),
                  rn = p.curRowNum +
                      (parseInt(p.page, 10) - 1)*parseInt(p.rowNum, 10);
              p.curRowNum++;
              return rn.toString();
          } },

        ...
    ],
    loadComplete: function () {
        var p = $(this).jqGrid("getGridParam");
        p.curRowNum = 1; // reset curRowNum
    }
});

Changing the column position of rownumber property in JQgrid

1 Answers1