I have a grid that has subHeaders and subColumns. Ideally when I select/deselect the parent column, it should display/hide the parent columns and headers along with its subHeaders and subColumns. However it is not working fine.
After a deeper investigation, I find that the index of the columns are messed up in this situation, which looks like 0,1,4,2,3 . And even worse, if there are dynamic columns, as we use k-rebind, the indexes of the columns are not unique any more.
5 Answers, 1 is accepted
As stated in the API reference for the hideColumns() method:
"When using multicolumn headers, using an index will hide a top-level column together will all its "child columns". In such scenarios, using field names or column objects may be more appropriate."
You can use the columns field to access and loop through the array of columns, and hide/show the desired ones accordingly.
I hope this helps, but if the issue persists, please send us an isolated runnable project, similar to the ones in our online demos, where the undesired behavior can be observed, so we can investigate it, and provide a more to-the-point suggestion, better suited for the custom scenario. Thank you in advance.
Regards,
Dimiter Topalov
Telerik by Progress
Rank 1
Do you have an online-demo that has dynamic columns using k-rebind?
The issue is the indexes of the cells is messed up which is returned by leafDataCells when we have dynamic columns.
Please refer to the screenshots I have attached. The date column should be No.2, however it is the third one in the cells. TotalHouseRestrictions change from No.3 to No.5.
Could you kindly investigate a little a bit from here before I send you a piece of isolated runnable AngularJS project?
The DOM TH elements are different than the column objects, representing each column, in the Grid columns field.
Only the "leaf" columns (the ones that do not have subcolumns) receive a data-index attribute. This is why using the hideColumn() method with number (index) arguments is not supported in multicolumn headers scenarios (as previously discussed).
In such cases either the field the respective column is bound to, or the object, representing the column itself, should be passed to the hideColumn() method.
I have prepared an example, demonstrating how to hide a column by clicking in its header cell. The sample implementation follows these main steps:
1) Attach a click handler on the Grid container (provide a "th" filter)
2) Check whether the column whose header is clicked, is bound; if so - call the hideColumn() method, passing it the respective field as a string
3) If the column is not bound, perform custom logic to get the column out of the Grid columns array, based on its title, and call the hideColumn() method, passing it the actual Grid column object (as taken from the Columns array)
http://dojo.telerik.com/uMoSU
Let me know if I am missing something from the desired functionality.
Regards,
Dimiter Topalov
Telerik by Progress
Rank 1
The hidden columns can be shown in a custom event handler by looping through the current Grid columns, and conditionally calling the showColumn() method, e.g.:
http://dojo.telerik.com/uMoSU/2
The desired functionality of hiding/showing parent columns via the ColumnMenu is not supported. This feature involves only columns, bound to a field that actually contain data. Template and parent columns do not have a ColumnMenu, as they can not be filtered and sorted - two of the main functionalities the ColumnMenu provides.
You can submit a feature request for the desired functionality to our UserVoice portal:
http://kendoui-feedback.telerik.com/forums/127393-kendo-ui-feedback
... it is closely monitored, and the most popular ideas are considered for implementation.
Alternatively, I can suggest the Progress Professional Services for custom implementation of features customizations:
https://www.progress.com/services/outsourcing/feature-customization
Let me know if you are interested, and I will arrange for someone from the team to contact you.
Regards,
Dimiter Topalov
Telerik by Progress