datepicker position is wrong

Sylvoie

Hello,

I'm integrating Datatable-Editor with a bootstrap admin template. All is working well except for datetime field. The calendar appears 90 pxs below of the date field.

When a use HTML 5 datepicker, the calendar appears just under the date field.

I found the problem, and how a correct the problem :

file : datatable.js
$.extend( Editor.DateTime.prototype, {
...
_position: function () {
...
top: offset.top - document.body.getBoundingClientRect().top + inputHeight,

I subtract document.body.getBoundingClientRect().top because it's frequent that value different than 0 in bootstrap framework.

Please correct.

Thank's

Sylvain

allan

Hi Sylvain,

Thanks for your question. Could you give me a link to a page showing the error so I can check into it please? I don't see the problem on this page or the other examples.

Thanks,
Allan

Sylvoie

Hi Allan,

Thank you to take time answering my question.

Honestly, I had this problem since I use bootstrap template (Datta able).

My application isn't on Internet, but on intranet. I don't have time to install it on Internet.

Without this bootstrap 4 template, the calendar in forms of my application works just fine.

I can share print screen if you need. But the fact is to have a fixte horizontal menu bar in the top of web page, the BODY of the web page is moved down of 90 pixels. This way, when you scroll the page, the menu bar stay in the top of the page.

The example that you shared doesn't have the same behaviour. When you scroll down the page, you don't have a menu that stay at the top.

I took a lot of time to figure out the problem, and I think it's usually with a bootstrap's template. Otherwise you don't have any trouble, and calendar works fine.

I applied the fix that I shared to you, and calendars appear at the right position in the form.

If you don't move down the BODY of your html page, the document.body.getBoundingClientRect().top will be zero.

Thank's

Sylvain

allan

Hi Sylvain,

This is the Bootstrap 4 example for Editor which uses datetime, but doesn't show the issue you describe.

Are you able to provide any other information on how I might be able to reproduce the issue. I don't really want to make a code change without being able to test the problem and check that it is resolved correctly.

Thanks,
Allan

Sylvoie

Hi Allan,

I understand your point of view

I will build a prototype accessible on internet. Let me little time for that.

Thank's
Sylvain