jQuery UI Widgets › Forums › TreeGrid › Show/hide multiple columns
Tagged: treegrid widget
This topic contains 5 replies, has 4 voices, and was last updated by Yavor Dashev 3 years, 5 months ago.
-
Author
-
I have a list box with options for a tree grid where I can hide or show multiple columns at a time. I have a set of columns and a total column. I want to check a box that hide everything but the total columns. I have searched but I was not able to find a solution in the forums.
Hi erikt_ctg,
The “hideColumn” method allows you to hide a column by its dataField which means that you can call the method for the columns you wish to hide – http://jsfiddle.net/jqwidgets/2RXVR/
Best Regards,
Peter StoevjQWidgets Team
http://www.jqwidgets.com/Correct. I’m calling
$(“#treeGrid”).jqxTreeGrid(‘hideColumn’,’firstName’);
But, as an example, I would want to hide two or more columns. Is there a way that I can could hide ‘firstname’ and ‘lastname’?
Hi erikt_ctg,
Yes, call the method for the firstName and then call it again for the lastName column.
Best Regards,
Peter StoevjQWidgets Team
http://www.jqwidgets.com/Hi, friend,
I have tried to do that but it won’t let me
I have tried like this:
$(“#jqxgridCotations”).jqxGrid(‘hidecolumn’,’EditAdj’);
$(“#jqxgridQuotes”).jqxGrid(‘hidecolumn’,’DeleteAdj’);also like this:
$(“#jqxgridCotations”).jqxGrid(‘hidecolumn’,’EditAdj’);
$(“#jqxgridQuotes”).jqxGrid(‘hidecolumn’,’DeleteAdj’);
$(“#jqxgridQuotes”).jqxGrid(‘endupdate’);Hi mpintoz,
The argument that the
hidecolumn
method accepts its the datafield of the corresponding column.
For example like in the following code snippet:// initialize jqxGrid $("#grid").jqxGrid( { width: 800, source: dataAdapter, showstatusbar: true, statusbarheight: 50, editable: true, sortable: true, filterable: true, showaggregates: true, selectionmode: 'checkbox', altrows: true, columns: [ { text: 'First Name', columntype: 'textbox', datafield: 'firstname', width: 190, }, { text: 'Last Name', datafield: 'lastname', columntype: 'textbox', width: 190, }, { text: 'Product', datafield: 'productname', width: 170, }, { text: 'Quantity', datafield: 'quantity', width: 85, cellsalign: 'right', cellsformat: 'n2', aggregates: ['min', 'max'], }, { text: 'Price', datafield: 'price', cellsalign: 'right', cellsformat: 'c2', aggregates: ['sum'] } ] }); $("#grid").on('rowselect', function (event) { // event arguments. let args = event.args, rowData = args.row.quantity, statusbarGrid = document.getElementById('statusrowgrid'), newSum = Math.floor( summaryData.sum + rowData ); summaryData.sum = newSum; statusbarGrid.lastElementChild.firstChild.innerText="Sum: $"+ newSum +""; }); setTimeout(() => { $("#grid").jqxGrid("hidecolumn","firstname"); $("#grid").jqxGrid("hidecolumn","price"); },1000);
Let me know if that works for you, but if it doesn’t its best to create a code example which reproduces the issue that you have in order to be able to give you a solution about it.
Please, do not hesitate to contact us if you have any additional questions.
Best regards,
Yavor DashevSmart UI Team
https://www.htmlelements.com/ -
AuthorPosts
You must be logged in to reply to this topic.