changing JQgrid column name dynamically

2019-01-18 14:22发布

问题:

I just need to rename JQgrid column dynamically as per user selection from a list of options. How can I do that?

回答1:

According to the jqGrid Documentation, colNames cannot be changed after the grid is created.

However, you might be able to simulate a column name change by using several columns. Then you can hide all of them except a single one which will be shown to the user. When the user selects another, just swap in the selected column. For example, if valid columns are [A, B, C, D] you might start by only showing A. Then if the user chooses C, hide A and show C. The main disadvantage to this approach is that you will need to copy the same data to many columns, however.

Update

Per Galichev's answer, you can use the setLabel method to rename a column header.



回答2:

You can use this syntax:

jQuery("#grid1").jqGrid('setLabel', 0, 'NewLabel');

This will change first column name to NewLabel in your grid with id=grid1.



回答3:

The latest version of jqGrid (4.1+ - possibly earlier) no longer appears to support the column index based setLabel approach described by Galichev, a columnName based approach is provided instead:

jQuery("#grid1").jqGrid('setLabel', 'columnName', 'NewLabel');

See the jqGrid Methods wiki for more information.

I've left the previous answer unedited as this approach may be valid in versions prior to 4.1.



回答4:

*setLabel : * colname the name of the column (this parameter can be a number (the index of the column) beginning from 0

However the index param does not work with version 4.1 and above.

Jqgrid uptop version 4.0

 $(tableId).jqgrid("setLabel", 0, "BBBBB");

Jqgrid version 4.1 and above

Try using these

  $(tableId).setLabel("ColumnName", "AAAAA");

or

  $(tableId).jqgrid("setLabel", "ColumnName", "BBBBB");


回答5:

JQGrid1.Columns.FromDataField(ColumnName).HeaderText = ColumnName;


回答6:

I gave my column name a div

'<div id="DateDivId">Date</div>'

Then I just changed it the normal way, getElementById, change contents.



标签: jqgrid