We are having issues with people filling out the calendar question incorrectly and we would like to block out the calendar question so they have to click on the calendar. Is there any way to do this?
Question
Question
Answer
Remove
$('.datepickeronly input').attr('readonly', true);
from line 40 and place it on line 2 so that it's inside of your document ready function.
Replies
Give your date field a CSS class like datepickeronly and then you can set the field to be readonly in JS. This will still allow the user to use the date picker to set the date and upon form submission, the date will be present.
$('.datepickeronly input').attr('readonly', true);
Right now I have a table with one of the columns as a date, and it has to be customizable.
Do I have this set right?
Right now that's not showing me the calendar for them to pick. Not sure what isn't working on this or what I'm doing wrong.
In the form editor UI, don't make the field read only. Uncheck the "Read-only" box. Just use the JS for making it read-only.
Hmmm, not sure what I have wrong, the date field isn't read only still. They're still able to put in numbers.
Here's a sample form I created. It just uses the default table field with the first column changed to a date and given the CSS class datepickeronly. You can also see the JS that's being used.
Here's what the submission form looks like. The field input is grayed out and can't by typed into, but you can use the date picker icon to pick the date.
After submitting the form, the value is saved properly.
Please see if there may be any other differences between your form and this generic sample form that may be preventing this from working for you.
Don't know why it's not working, must be me doing something dumb that I'm not catching.
Here's what I have at this point.
Really hope you see what I'm doing wrong. Could it be related to the other coding I have in JS?
The code goes into the JS section, not the CSS section. The date field in the form will use the CSS class name datepickeronly, but you need to have
$('.datepickeronly input').attr('readonly', true);
in the JavaScript section.
Hmm, I'm at a loss. Seriously don't know what I'm doing wrong.
And I don't have them set to read only. Honestly, I must be doing something stupid that I'm missing, but I'm just not finding the problem.
Remove
$('.datepickeronly input').attr('readonly', true);
from line 40 and place it on line 2 so that it's inside of your document ready function.
IT WORRKKKKKEDDD!!!!
Thank you so much for helping!
I'm building a new form and using this same coding on the new form.
For some reason it's not working and I'm guessing it's something I'm missing.
Here's my CSS:
And here is the CSS class that I'm using for the question that needs to be the "datepickeronly"
Can you see what I'm missing on this?