jqGrid icon indicating copy to clipboard operation
jqGrid copied to clipboard

Question bootstrap v5 responsive show/hide columns

Open periklis-periklis opened this issue 2 years ago • 2 comments

Question,

jqgrid 5.6/7, jquery 3.6, bootstrap v5.

Do we need to listen for a resize event and add bootstrap v5 hide/show classes to columns or can we define bootstrap 5 hide classes as in the column definition using classes and labelClasses?.

e.g. column definition with bootstrap v5 would like to hide column when screen is smaller than 'lg'

{name:'col1', index:'col1', search:true, classes: "d-none d-lg-block", labelClasses: "d-none d-lg-block", searchoptions: {clearSearch:false}, editable:false, width:80, sortable:true, align:'left'},

If anyone can assist in answering question it is appreciated.

periklis-periklis avatar May 19 '22 00:05 periklis-periklis

Hello,

The exact answer is: You will need to listen on resize and do showCol and hideCol methods to show hide columns. Adding bootstrap classes will not help.

I recommend you too if you got with this solution to use resizeGrid method. https://github.com/tonytomov/jqGrid/blob/646a44ea947e792b7970eb407f3b37163d53e4d1/js/grid.base.js#L5677 https://github.com/tonytomov/jqGrid/blob/646a44ea947e792b7970eb407f3b37163d53e4d1/js/grid.base.js#L7470

Regards

tonytomov avatar May 20 '22 06:05 tonytomov

Thank You.

periklis-periklis avatar May 20 '22 12:05 periklis-periklis