custom-widgets icon indicating copy to clipboard operation
custom-widgets copied to clipboard

Add "readonly" attribute to bootstrapdatepicker HTML input element

Open hoechenberger opened this issue 4 years ago • 4 comments

This ensures that the value in the input field can only be changed via the datepicker. Without this attribute, users may click into the input field and add arbitrary text by typing on their keyboard. This should almost never be what one (as a developer) wants when using a datepicker widget.

Note that this is completely orthogonal to the datepicker's enableOnReadonly and to SurveyJS's isReadOnly attributes.

hoechenberger avatar Jun 24 '20 10:06 hoechenberger

I see. But why we need to limit a user?

tsv2013 avatar Jun 24 '20 14:06 tsv2013

Hello @tsv2013, sorry for the late response, I was on vacation!

I see. But why we need to limit a user?

My understanding is that the idea of using a date picker (from a developer's point of view) is usually two-fold:

  • present a visually pleasant and easy-to-use way for users to enter dates
  • ensure that what is entered into the form is actually parsable as a date in a specific format

Currently, the user may use the date picker, which will produce a date according to the format specified in question.dateFormat (defaulting to "'mm/dd/yyyy'"). On devices with a touch interface, this is typically all that users can enter – which is great for me as a developer, because I can control exactly which format the returned data will have, so it's easy to parse and e.g. store in a database!

On my desktop computer, however, I can try to be clever and manually modify the input text field, whose content is controlled by the datepicker widget, by adding a few keystrokes, or simply pasting arbitrary content. This is possible because the date input field is really just an ordinary text field that is writable. For me as a developer, this is really unfortunate because I cannot be sure which kind of input I will receive: even though I specify a dateFormat for my question, I cannot rely on the fact that what I get back actually is in that format!

This PR fixes this issue: by declaring the input field read-only, users cannot "manually" modify its contents, but can only do so by using the date picker. This, then, guarantees that the input value corresponds to question.dateFormat.

I hope my explanation helped clear things up a little! Please let me know if I can be of any more help.

hoechenberger avatar Jul 04 '20 16:07 hoechenberger

Can you please implement this feature optional? Users are used to input values and I believe limit them is not a good practice.

tsv2013 avatar Jul 07 '20 12:07 tsv2013

Can you please implement this feature optional? Users are used to input values and I believe limit them is not a good practice.

Sure, will add it! Thanks for your feedback.

hoechenberger avatar Jul 08 '20 12:07 hoechenberger