Question

Form field fine in testing, but invalid input for others

Forms Version 10

Updated December 8, 2016

asked on December 6, 2016 • Show version history

The last field on the right (Range: 12) is fine in testing, but when I got someone else to test the form for me, she gets an Invalid Input message. This is just a blank little field. I'm thinking maybe the issue is the size is too small on some screens?

I desperately want this set up to remain the same, but if I try to increase the size of the fields things don't line up right. What else can I do to make these four fields to stay side-by-side? Or, what else might be causing this invalid input?

Interesting that the collection field (the Burn Site address) has allowed the 12 to fill in.

This is what I have in CSS for these boxes.

0 0

Replies

replied on December 8, 2016

IT'S WORKING NOW! I documented everything I'd done building the collection field, then deleted just the Range field (the one giving the Invalid Input msg). Logged out, tested without it. then went back in and rebuilt that piece back into the collection field. No problems now.

So, there was just some kind of a glitch holding onto that field.

1 0

replied on December 7, 2016

Hi Connie, use this adjusted CSS for your Fields and they will take less room on the page

#q35 label {width:70px;text-align:right;}
#q36 label {width:70px;text-align:right;}
#q37 label {width:70px;text-align:right;}
#q38 label {width:70px;text-align:right;}
#q35 .cf-field {width: 30px; min-width: 30px;}
#q35 .cf-medium {width: 30px;}
#q36 .cf-field {width: 30px; min-width: 30px;}
#q36 .cf-medium {width: 30px;}
#q37 .cf-field {width: 30px; min-width: 30px;}
#q37 .cf-medium {width: 30px;}
#q38 .cf-field {width: 30px; min-width: 30px;}
#q38 .cf-medium {width: 30px;}

#q35, #q36, #q37, #q38 {display:inline-block;}

I find that using the .cf-medium (or whatever your field width is set to in the fields properties) gives you better control than using .cf-size

Regarding the Invalid Input, I would only expect that behaviour if the entry did not meet the fields constraint or was an invalid character such as a text character in a number field.

0 0

replied on December 8, 2016

Thanks, Steve. I have made the adjustments, but 30px is too small (too narrow even for one digit to show up) but the changes did bring the distance between each field closer, which I liked. Even at the 100px I had been using for field width, a simple "NW" input was too wide for the field but I was letting that go because any wider and the last field was wrapping down to another line. And it is my understanding that if I widen the whole Form margins, it might not be optimal for use on a mobile phone.

Is there some more tweaking on this we can do that will allow the field width to stay at 100 but the distance between each field be less? I've tried changing one or another of the numbers in these three spots, but none of the three seem to control that part alone.

#q35 .cf-field{width:30px;min-width:30px;}
#q35 .cf-medium {width: 30px;}

Okay, so that's a side-line; I'll deal with the Invalid Input issue in a separate reply.

0 0

replied on December 8, 2016 • Show version history

Okay, so we have narrowed down the problem. Definitely not the configuration of the fields. When my test person uses MS Edge or Explorer she gets the Invalid Input message. When she uses Chrome for her browser, she does not get the Invalid Input message. ??? I have confirmed that, even for me, only Chrome will allow that one field to fill in without the Invalid Input message.

0 0

replied on December 8, 2016

Great to hear!

0 0

You are not allowed to follow up in this post.

Question

Question

Form field fine in testing, but invalid input for others

Replies

Sign in to reply to this post.