Datetime Year or Month selection problem on Mobile device

Datetime Year or Month selection problem on Mobile device

dt1 dt1 Posts: 52Questions: 5Answers: 0

When using Editor with "Datetime" field on a Mobile device there is a problem with the latest version (1.9.4) when trying to select the Year or Month from the Calander widget. The widget just closes as the list of Years or Months can not be scrolled for selection. You can try the Example found on site:

https://editor.datatables.net/examples/dates/dates

This did ot happen in previous version 1.9.0

«1

Answers

  • colincolin Posts: 15,112Questions: 1Answers: 2,583

    For me, if I press the date field twice, then the calendar is being displayed. As you say, the first click gets hidden under the keyboard, but the second click then displays it. This is on Android.

    Does that happen for you too?

    Colin

  • dt1 dt1 Posts: 52Questions: 5Answers: 0

    I refer to the Click on the Month or Year inside the Calander once it is already open as you described.
    It is on Android.
    I did not try on IOS.
    Once you click on the Month or Year than it pops up for a brief moment and than the Calander vanishes from the screen

  • colincolin Posts: 15,112Questions: 1Answers: 2,583

    i'm definitely not seeing that - the calendar stays open and the days are selectable. Are you using the built-in Chrome, or a different browser? I'm on Android 9,

    Colin

  • dt1 dt1 Posts: 52Questions: 5Answers: 0

    Hi Colin,
    I'm on Android 8, Xiaomi device.
    I have uploaded a video capture to this public site:

    https://streamable.com/0mhiv1

    The Years and Months just vanish so you can not select a different Year or Month without scrolling through the widget or without entering it manually

  • dt1 dt1 Posts: 52Questions: 5Answers: 0

    I have also just reproduced on Android 9 with Google Chrome and on iPhone with Safari browser.

  • colincolin Posts: 15,112Questions: 1Answers: 2,583
    Answer ✓

    when trying to select the Year or Month from the Calander widget.

    I must apologise, I entirely missed that part (twice!) when I read your comment, I was just trying to select a date. Yep, I'm seeing that too. I've raised it internally (DD-1682 for my reference) and we'll report back here when there's an update.

    Cheers,

    Colin

  • allanallan Posts: 61,435Questions: 1Answers: 10,049 Site admin
    Answer ✓

    This will be fixed in Editor 1.9.6 which I plan to tag up and release later today.

    Allan

  • dt1 dt1 Posts: 52Questions: 5Answers: 0

    Thank you for your support.

  • dt1 dt1 Posts: 52Questions: 5Answers: 0

    Hi. When is this fix planned for Editor 1.9.6 is expected to be released?

  • colincolin Posts: 15,112Questions: 1Answers: 2,583
    Answer ✓

    It should be sometime next month. Sorry I can't be any more specific.

    Colin

  • colincolin Posts: 15,112Questions: 1Answers: 2,583

    Just to let you know we made the release yesterday,

    Colin

  • dt1 dt1 Posts: 52Questions: 5Answers: 0

    Hi Colin,
    It looks much better with Editor 1.9.6
    Works OK on my Android phone with Edge and Chrome browsers.
    Works OK also on my MAC with Safari
    Works OK also on my PC with Google Chrome

    The only issues I can see is sometimes with Firefox browser on all platforms MAC, PC Linux (Ubuntu). When using "datetime" field , especially when Adding a new line with the Main Editor mode, I still have the same date menu disappearing issues.
    When using Firefox to just edit an existing "datatime" entry it sometims works better.
    However, this did not happend to me on your website Examples with Firefox so I'm not sure.
    I have updated the micasabook.com web site with Editor 1.9.6 so you can see for yourself.
    Thank you again
    Elan

  • colincolin Posts: 15,112Questions: 1Answers: 2,583

    Glad mobile is better. I just tried it here on Ubuntu/FF and as you say, it's working as expected. Are you able to link your page so we can take a look?

    Colin

  • dt1 dt1 Posts: 52Questions: 5Answers: 0

    Hi,
    You can use the following temp credentials to enter and play with different places that include dates with Firefox.

    https://www.micasabook.com/mbloginv2.php

    user: Colin123456!
    pass: Colin123456!

    Elan

  • colincolin Posts: 15,112Questions: 1Answers: 2,583

    Thanks, I logged in, but none of the four tables seemed to have a datetime field. Could you point me in the right direction, please?

    Colin

  • dt1 dt1 Posts: 52Questions: 5Answers: 0

    Please select the first person. Than try to Edit his details such as date of birth etc

  • dt1 dt1 Posts: 52Questions: 5Answers: 0

    You can add a new home. Select it and try to add an Appliance. There is A warranty field

  • dt1 dt1 Posts: 52Questions: 5Answers: 0

    This does not happen with Bubble editing with Firefox only with main Editor mode

  • colincolin Posts: 15,112Questions: 1Answers: 2,583

    Nope, still not seeing it - I checked that before. See screenshot here for the person, I'm not seeing a DoB field:

    Colin

  • dt1 dt1 Posts: 52Questions: 5Answers: 0

    Hi Colin
    You need to click on the picture icon and get inside into the details of the person.

  • dt1 dt1 Posts: 52Questions: 5Answers: 0

  • dt1 dt1 Posts: 52Questions: 5Answers: 0

    Well after taking another look, I think it only happens when the Primary Editing Form is relatively long with FireFox. It is working OK on Shorter Forms or in Bubble mode.

  • colincolin Posts: 15,112Questions: 1Answers: 2,583

    Ah, I'm seeing the form now - nice photo ;) - but not the problem. I tried with DoB, National ID Issue and Validity and they all appear as expected in both Chrome and FF (I'm on Ubuntu 20.04).

    Do you have a form that does demonstrate the issue?

    Colin

  • dt1 dt1 Posts: 52Questions: 5Answers: 0

    It only happens with Firefox. When you have a form with many fields it takes a significant part of the screen. In this scenario the Years and Months menus in the Datetime picker are disappearing. It will not happen with shorter forms. Please try the personal health insurance. Or in the Properties please select the first home go to Appliances tab and try to add a new appliance. There is a warranty field. The firm has many fields so for me the Primary editing with FF does not work well

  • dt1 dt1 Posts: 52Questions: 5Answers: 0

    All your website examples have relatively short forms with not to many fields. Maybe you can try to duplicate or add some fields to test this

  • colincolin Posts: 15,112Questions: 1Answers: 2,583

    Got it - I'm seeing it - we get there eventually :)

    I couldn't reproduce it locally, so it may be something to do with your styling perhaps, but we'll take a look and report back,

    Colin

  • allanallan Posts: 61,435Questions: 1Answers: 10,049 Site admin

    It looks like you've got the Boostrap and DataTables styles mixed together. I'm not sure if it is the issue, but it would certainly be one thing to eliminate.

    You should only include one stylesheet for each of our libraries - e.g. for DataTables:

    Don't include both

    • jquery.dataTables.css and
    • dataTables.bootstrap.css

    Just pick one. Likewise for Editor and all the other components

    The download builder can help make sure you only get the files you need.

    Allan

  • dt1 dt1 Posts: 52Questions: 5Answers: 0

    Hello Allan,
    Thank you again for your support.
    I have tried to choose only one style, but this is not solving the issue at all.

    Again, it happens only with Desktop FireFox on Primary Forms that have many fields. This is what I have seen also in older Editor versions such as 1.9.0.
    It is enough that I take out a few fields from the Form and everything works as expected.
    With other browsers it is ok now with version Editor 1.9.6.
    So only FireFox with long Primary Forms and "datetime" is suffering from Year and Month Menus disappearing.

    Elan

  • allanallan Posts: 61,435Questions: 1Answers: 10,049 Site admin

    Hi Elan,

    Thanks for the further information. I've just tried it on our standard example but with a really small browser window and wasn't able to reproduce it in Firefox/Linux.

    I've also just tried it with more fields but again wasn't able to reproduce it there. Is it doing it for you in that example?

    Thanks,
    Allan

  • dt1 dt1 Posts: 52Questions: 5Answers: 0

    Hi Allan,
    No I don't have a problem with your example. It works just fine.
    But I'm using Bootstrap4 adn BS4 styling and your example does not.

    If I have more than 9 fields in my forms I have the Menu problem appearing with "datetime" widget only on Firefox.

    Less or equal to 9 fields in the Form it works ok as expected.

    Elan

This discussion has been closed.