Column to show only when collapsed

Webix JS
1

Hi

Have a look at this snippet: http://webix.com/snippet/3c4dfd91

I would like to show “Sum” column only if corresponding month column is collapsed, otherwise only 4 weeks should be visible.
How can I achieve this functionality?

2

You can’t hide or show first column in the column group, but you can change its width to 0 and back to normal size

http://webix.com/snippet/f401441e

Code can be placed directly in the custom columnGroup control, instead of onStructureUpdate handler

3

Great. Works fine. But the header text is somewhat visible and overlaps with first visible column text.

http://webix.com/snippet/98cbc953

Can the header text be updated on the fly? Couldn’t find an api for that.

4

Also I can change data format or/and column configuration if the functionality can be achieved efficiently in any other way by doing that.

5

As for header text - you can change any value in column’s configuration
http://webix.com/snippet/49764bd5

6

The functionality can be achieved by customizing columnGroup control ( it can hide columns 2-4, and change the header text and template for column 1, so instead of Jan. value it will show a summ. )

It is quite a lot of coding, so if you need a full example - please open a support ticket.

7

I was able to get desired functionality by changing the width. However, I have to press an extra key while using keyboard navigation. Also, tab navigation stops at column with 0 width and doesn’t go forward.
Any suggestions?

8

There is no built-in way to skin zero-height columns.

You can redefine the moveSelection method of datatable. This method is called after pressing a navigation hotkey, so you can place a custom key-handling there.