Header datepicker

Tags: #<Tag:0x00007efc64eb3c48>
#1

I am trying to implement a date picker in a column header without success so far. Is this possible?

Thanks

#2

Hi @alejsouza

It’s possible, I think.

Here is our tutorial about custom renderer - https://handsontable.com/docs/7.4.2/demo-custom-renderers.html#page-header
As you can see in colHeaders option is added some HTML. Next, we need to listen to an event. In your case, it probably is a click (not mouse events as an example).

This is another demo - https://codesandbox.io/s/icon-inside-a-header-rs9sg - which uses afterGetColHeader hook to add custom HTML in column header.

It’s completely up to you which option to attach data picker you will choose.

#3

Thanks!,
I was able to do it using a custom render for colHeaders (adding a text input) and then since I am using nested headers, I end up using afterGetColHeader hook to convert the text input in a bootstrap date picker and to mantain the control values

#4

Great. I’m glad to I could help you.

#5