jQuery Grid Plugin - jqGrid

Yes, you can dynamically add columns, but the trick is to provide placeholders for them in the colmodel.

1. Provide a number of empty column names in the colModel definition -- I used 30, just an arbitrary number, expecting my search results to never require more than this....ensure that they are easily labeled: {name: 'p1', index: 'p1', hidden: true }...{name: 'p30', index:'p30', hidden: true }

2. define the 'datatype: function(postData)' function on your jqgrid to handle the custom loading of the ajax call, which will require you to add the JSON data to the grid yourself using the addJSONData(jsonObject) method with the jsonObject being correctly formatted per your colModel.

3. Inside your datatype function, you can then loop through your returned ajax results and use the below mechanism to dynamically rename and put titles on your hidden 'placeholder' columns (all the p1...p30) that you have defined in the colmodel: 

$("#jqGridId").jqGrid("setLabel", 6, "Dynamic Column Name");

$("#jqGrid").jqGrid('showCol", 6)

In the above, 6 is a reference to the colModel array index (so this would be the seventh column defined in the colModel). This way, because the columns change based on your searching, you can dynamically label and show as many columns (up to 30 in this case) as you need. 

Hope this helps.

nmganesh said:

Hi,

Can anyone tell me if there is a way to dynamically change the column names/headers of the jqGrid?

For me the column names has to come from the Server data. Depending on the search criteria, data(no. of  columns) changes.

Number of columns and rows of data will change depending on the search Criteria. Will it be possible to achieve this?

The Key here is, I need to get this column names information from the Server response.

Any help on this will be great....