Hide a column in bootstrapTable using javascript or jQuery

Question

I'm using bootStrap Table for my users using below example.

http://www.redexperu.com/assets/js/bootstrap-table-master/docs/examples.html#via-javascript-table

I want to hide Edit and delete options by hiding in operate (Here Delete User Column) data field in the table. I was trying to do it by using below command

$('#table').bootstrapTable('hideColumn', 'operate');

by refering this

https://github.com/wenzhixin/bootstrap-table-examples/blob/master/methods/showColumn-hideCoulumn.html

It doesn't seems to work. Here is my sample code. This is not complete one. I added here only parts I thought necessary.

https://jsfiddle.net/Menuka/ht3dwwt9/4/

My table works fine but not the column hiding part.

Answer 1

As Bharat mentioned in his comment, my code works fine. But the problem is when hidecolumn and showcolumn are executing, the table is not loaded. So those commands run uselessly. One way to avoid these kind of situations is to bind it with event like .click(). In my case it is not the solution. After a while I find out this setTimeout method. So I used it to solve my problem like below.

<script>
 setTimeout(function(){ $('#table').bootstrapTable('showColumn', 'operate2'); }, 100);
</script>

you can find out about setTimeout method referring this. http://www.w3schools.com/jsref/met_win_settimeout.asp

Hope someone find this useful. Any other solutions are welcome.