Question

Date Field Calendar Popup Blocking Entry Box

Forms

Updated May 23, 2016

asked on March 24, 2016

I have a form (Forms 10) with a date field at the bottom and when the user clicks on the field or on the calendar icon, the calendar pops up and covers the text box. This is a problem when they are trying to type the date as they can't see what they are typing. Below is a screenshot and I put a red box where the corresponding box is where I am trying to type the date.

This issue does not happen when the date is not at the bottom of the form. It appears to be a spacing issue where there is not space below the field to pop up the calendar so it just puts it on top of the entry box.

Anyone else seen this issue? The only thing I can think to do is to hide the calendar pop up completely so they have to type it.

0 0

Answer

SELECTED ANSWER

replied on May 23, 2016

Hi all,

A Support Case was opened a few days ago. The issue seems to be with a Google Translate script embedded in a custom HTML element interfering with the positioning of the datepicker element. We could reproduce this issue with those elements if "Optimize form layout on mobile devices" is unchecked in the form options (see attached image).

If this must remain unchecked for some reason, adding the following to the custom CSS of the form also resolves the issue:

html, body {
    width: auto;
    overflow-x: hidden;
}

Thanks to Rui for finding the solution!

2016-05-23_1057.png (86.53 KB)

| Download

1 0

Replies

replied on March 24, 2016

Beau,

I am running Forms 10 but don't run into this issue. Are you using any custom CSS on your form? What browser/version do you experience this on? Here's an example of what I see.

0 0

replied on March 24, 2016

I've removed all CSS & javascript and set it to a default theme and the issue is still there in both Chrome and IE. If I give the date field plenty of space then it puts the calendar significantly below the field.

What is even weirder is that the issue only happens on Forms that were built in 9.X (a different environment), exported, and imported into this environment that was installed as 10 (never upgraded from an older version). If I create a brand new form it does not have the issue. Also, the issue is not there when the Form is in Preview mode but is there when attempting to submit a live version either via the link or starting it from the Process Diagram. All previous images were when attempting to submit it but here are some when the same form is in preview mode:

The final thing that is odd is the calendar size. In the shot below, the calendar on the left is the brand new form and the one on the right is the one imported from 9.2.

At this point I am thinking it is a bug in bringing forms that were built in 9.2 over to a system that is running 10 as it is happening with all 3 forms we brought over.

0 0

replied on March 27, 2016

Hi Beau,

I can't reproduce this issue when built a form in 9.2 with a date field at the bottom then import to 10.0. Can you open an support case and provide the exported process that can reproduce this issue to support so that we reproduce it and fix it?

0 0

replied on March 28, 2016

We are opening one this morning.

0 0

You are not allowed to follow up in this post.

Question

Question

Date Field Calendar Popup Blocking Entry Box

Answer

Replies

Sign in to reply to this post.