How to hide a jqgrid column dynamically

Question

I am implementing jqgrid in my asp.net MVC web application.

In my grid i have two columns edit and delete. The delete should be visible only if the user is logged as admin .

How can we dynamically hide.show columns in jqgrid. I am having a session variable to check whether the logged in user is Admin or not.

I am accessing that variable in javascript. but, not sure how can i hide/show column in jqgrid

Please help..

Detonate

Answer 1

This one worked:

$("#list").hideCol("ColumnName")

Detonate

Answer 2

Use this code,

jQuery("#list").jqGrid('hideCol',["colModel1_name","colModel2_name"]);
jQuery("#list").jqGrid('showCol',["colModel1_name","colModel2_name"]);

May this help you.

Archetype

@Vinoth..what are colmodel1 and colmodel2? – Detonate

Both are name in your colmodel definition which are the columns you want to hide. – Archetype

What if I need to hide the colModel in the add form dialog? I tried this in beforeShowForm but it did not work, – Ignacioignacius

Check this answer – Archetype

Answer 3

Newer API

jQuery("#list").jqGrid('hideCol',["ColumnName","ColumnName2"]);

Older API

$("#list").hideCol("ColumnName")

Woad

Answer 4

This is not the best practice to use js to manage your security. You should not show this column on your server side!

Thumbstall

I am calling that javascipt from server side based on session information. So , i guess i am dong it from server side itself. I think jqgrid is purely jquery plugin. i think there is no other way to do it rather than using jquery.. – Detonate

I agree with @Thumbstall - I use the server to programmatically write out the column model. If the user doesn't have permissions, then, the delete column is never written out to their browser. It's not 'hidden' where they might discover it in the view-source.. it's simply not there – Supereminent

Answer 5

I had to dive into some legacy stuff today. One of the requirements was to conditionally set the visibility of some columns. There was a drop down on the page that set a category parameter in the where clause for the grid. Long story short, watching the change event of the drop down wasn't possible making most of the methods in the answers here invalid.

I was able to use a ternary in the hidden param to set the visibility.

{
    name: 'mfg',
    index: 'mfg',
    width: 150,
    sortable: true,
    hidden: $('#evCategory').val() == 'Calibration' ? false : true
},

And it simply evals to if the dropdown has a value of calibration hidden should be false, if calibration is not the value hidden should be true.

Might also be able to shorten it to;

!$('#evCategory').val() == 'Calibration' || true

Although I haven't tested that.

Phillie