Datepicker position

Tags: #<Tag:0x00007f8b2b1d3f18>

Hello

When handsontable is taking the full viewport, last lines are “near” the bound of navigator and when modifying a date cell, datepicker will appear below the line so you can’t see it.

Tried to have position:‘top left’ in datePickerConfig definition or inside column definition but does not hep

How would you define a “date” column so that datePicker appears automatically in a viewable part of the screen please ?

Regards
Francois

Hi @fmartinez

Please track progress to this topic on our Github board https://github.com/handsontable/handsontable/issues/3483 it relates to the date-picker visibility when used on the last row.
There is no official fix but 10 days ago one of the developers has shared a script that can be a good workaround.

great. thank you. found the gist and the extension. but would mind ask the dev if you know him where I should plug the extension ? in my code ? in vendor code ?

It is an editor so firstly you just paste the code before the instance is initialized and then refer to it via editor settings

const Base = (Handsontable.editors.DateEditor as any).prototype as any
const DateEditorHelper = Base.extend()
DateEditorHelper.prototype.showDatepicker = function(...args: any[]) {
    ....
}

var
    example = document.getElementById('example1'),
    hot = new Handsontable(example,{
    data: myData,
    editor: DateEditorHelper 
  });

ok thanks. it does not compile at

const Base = (Handsontable.editors.DateEditor as any).prototype as any

Module build failed: SyntaxError: Unexpected token, expected , (98:46)

96 | }
97 |

98 | const Base = (Handsontable.editors.DateEditor as any).prototype as any
| ^
99 |

Anyway you can close my request. will try to find it later

OK. Feel free then to open a new ticket if needed.