JqGrid hide column on view depends on another column value

Question

I want to show the session column based on the corresponding cell value of the type row. The session column is hidden.

To hide the session column, I used this below code snippet,

 { name: 'session', index: 'session', hidden:true, editrules:{edithidden:true} }, 

So, I just want to show this column value only in view . If the cell type value is Full , I want to hide session in view . Otherwise, I want to show the value of the session column in view .

I tried using this code below,

 onSelectRow: function (id) { var celValue = $('#statGrid').jqGrid('getCell', id, 'type'); if (celValue === 'Full') $('#statGrid').jqGrid('getColProp', 'session').editrules.edithidden = false; if (celValue === 'Half') $('#statGrid').jqGrid('getColProp', 'session').editrules.edithidden = true; } 

As soon as the first if condition gets a successful edithidden property, changed to false . So, it hides session in the form of a view. But I could not change this property to true when my second if condition succeeded.

Why did this happen? Is this the right way to accomplish this task? or is there a better way to do this?

Answer 1

I would recommend that you use the beforeShowForm and afterclickPgButtons the View parameters. The demonstration demonstrates this. Demonstrate the following code:

 var showIdRow = function ($form) { var $this = $(this), rowid = $this.jqGrid("getGridParam", "selrow"), isClosed = $this.jqGrid("getCell", rowid, "closed"); if (isClosed === "Yes") { $("#trv_id").show(); // "trv_" is the prefix, "id" is the column name } }; $("#list").jqGrid({ .... colModel: [ { name: "id", width: 65, hidden: true, editrules: {edithidden: false} }, ... ] ... }).jqGrid("navGrid", "#pager", {view: true}, {}, {}, {}, {}, { recreateForm: true, afterclickPgButtons: showIdRow, beforeShowForm: showIdRow }); 

The demo shows the "id" column only in the view form and only if the chechbox is checked in the "Close" column.