Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
    Posts
  • #348350

    We have created an appointment form that has a calendar on it to choose the appointment date. There is an issue with this when viewing the form/calendar in mobile browsers.
    Please view the following page in a mobile browser:
    http://www.charleseliassalon.com/schedule-an-appointment/
    Scroll down to “Date for Appointment”.
    When you click the filed under “Date for Appointment”, a calendar does in fact appear, but it appears ABOVE the field. No one understands that there is an interactive form to choose a date from unless you scroll up.
    Can the interactive calendar form appear on top of the field or some other way that makes it obvious to people that there is an interactive calendar?
    Thank you,
    Dan

    #348870

    Hi charlie1!

    The calendar uses javascript to decide whether to display above or below the select field depending on where it is in your screen. For example if you click on the select field and it’s at the bottom of your screen then the calendar wouldn’t be visible so it displays on top. If you scroll down so the select field is at the top of your screen then the calendar displays on the bottom so it’s visible.

    I don’t recommend changing this as it’s good design practice. If you still want to force it in a certain direction though I found this which may help, http://stackoverflow.com/questions/1526500/getting-jquery-uis-datepicker-to-always-open-in-a-certain-direction. It looks like you would need to edit the core jQuery datepicker code.

    Regards,
    Elliott

    • This reply was modified 9 years, 11 months ago by Elliott.
Viewing 2 posts - 1 through 2 (of 2 total)
  • You must be logged in to reply to this topic.