Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

calcite-input-date-picker: not preventing typing values outside or min/max #4276

Closed
rpanichakit9541 opened this issue Mar 18, 2022 · 12 comments
Closed

calcite-input-date-picker: not preventing typing values outside or min/max #4276

rpanichakit9541 opened this issue Mar 18, 2022 · 12 comments
Labels
4 - verified Issues that have been released and confirmed resolved. bug Bug reports for broken functionality. Issues should include a reproduction of the bug. design Issues that need design consultation prior to development. p - medium Issue is non core or affecting less that 60% of people using the library ready for dev Issues ready for development implementation.
Milestone
2024-04-30 - Apr ...

Comments

@rpanichakit9541
Copy link
Contributor

Actual Behavior

When typing into the input, I can change the value to be less than the min or greater than the max

below_min_input_date_picker

Expected Behavior

The textbox should restrict the user input to be within the min/max values similar to how the actual date picker is behaving.

Reproduction Sample

https://codepen.io/rpanichakit/pen/popyPVX?editors=1001

Reproduction Steps

  1. Click into the input and delete "8" to turn 3/18/2022 to 3/1/2002
  2. Observe that the value is changed and that the event triggered the div to display the new value property

Reproduction Version

beta.79

Relevant Info

Windows 10, Chrome 99.0.4844.74

Regression?

No response
@rpanichakit9541 rpanichakit9541 added 0 - new New issues that need assignment. bug Bug reports for broken functionality. Issues should include a reproduction of the bug. needs triage Planning workflow - pending design/dev review. labels Mar 18, 2022
@jcfranco
Copy link
Member

[Implementor's note] the picker should scrap invalid values on blur and keep last valid value. cc @macandcheese @benelan

@ethanbdev
Copy link
Contributor

Could be related: #4187

@benelan benelan removed the needs triage Planning workflow - pending design/dev review. label Apr 8, 2022
@benelan benelan added this to the Sprint 04/11 - 04/22 milestone Apr 8, 2022
@anveshmekala
Copy link
Contributor

do we scrap invalid values on blur event or keyup event for the input @macandcheese @jcfranco ?

@benelan benelan mentioned this issue May 10, 2022
Open
@anveshmekala anveshmekala self-assigned this May 11, 2022
@anveshmekala anveshmekala added 1 - assigned Issues that are assigned to a sprint and a team member. and removed 0 - new New issues that need assignment. labels May 11, 2022
@anveshmekala anveshmekala mentioned this issue May 11, 2022
Closed
@anveshmekala anveshmekala added 2 - in development Issues that are actively being worked on. and removed 1 - assigned Issues that are assigned to a sprint and a team member. labels May 12, 2022
@jcfranco
Copy link
Member

@anveshmekala on blur, as stated above.

@patrickarlt patrickarlt mentioned this issue May 17, 2022
Closed
@anveshmekala
Copy link
Contributor

how do we handle the case where the user type in an invalid value outside of min/max range and the value prop isn't parsed initially. Thoughts ? @macandcheese @jcfranco

@jcfranco
Copy link
Member

Wouldn't it be set to the initial value in this case? Let me know if I missed something.

@anveshmekala
Copy link
Contributor

anveshmekala commented May 17, 2022 •
edited
Loading

Wouldn't it be set to the initial value in this case? Let me know if I missed something.

In the case where value prop isn't parsed initially.

Example: ( assume user entered 01/01/2050 in input field after first render.)

<calcite-input-date-picker min="2022-05-01" max="2022-05-15" ></calcite-input-date-picker>

@anveshmekala anveshmekala added 0 - new New issues that need assignment. and removed 2 - in development Issues that are actively being worked on. labels May 17, 2022
@benelan benelan self-assigned this Sep 12, 2023
@benelan benelan added 1 - assigned Issues that are assigned to a sprint and a team member. and removed 0 - new New issues that need assignment. labels Sep 12, 2023
@benelan benelan assigned eriklharper and benelan and unassigned benelan and eriklharper Sep 12, 2023
@benelan benelan mentioned this issue Oct 2, 2023
Merged
@benelan benelan added 2 - in development Issues that are actively being worked on. and removed 1 - assigned Issues that are assigned to a sprint and a team member. labels Oct 2, 2023
benelan added a commit that referenced this issue Oct 2, 2023
@benelan
feat(input-date-picker, input-time-picker): add status property (#7915)
4d53346 
**Related Issues:** #5723, #4276

## Summary

Add `status` property to `calcite-input-date-picker` and
`calcite-input-time-picker`. Validation messages will be added in a
second pass to ensure consistency with the messages displayed for
components with invalid values on form submission.
@benelan benelan mentioned this issue Oct 12, 2023
Closed
4 tasks
@benelan benelan added the blocked This issue is blocked by another issue. label Oct 12, 2023
@brittneytewks brittneytewks removed the figma changes Issues that require additions or updates to the Figma UI Kit where no `design` label exists label Dec 11, 2023
@geospatialem geospatialem removed the blocked This issue is blocked by another issue. label Jan 18, 2024
@geospatialem geospatialem added 4 - verified Issues that have been released and confirmed resolved. and removed 2 - in development Issues that are actively being worked on. labels Apr 30, 2024
@geospatialem
Copy link
Member

Verified in 2.8.0-next.19 with https://codepen.io/geospatialem/pen/jORoLWq when the component's max is set to "4/30/2024":

verify-4276

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
4 - verified Issues that have been released and confirmed resolved. bug Bug reports for broken functionality. Issues should include a reproduction of the bug. design Issues that need design consultation prior to development. p - medium Issue is non core or affecting less that 60% of people using the library ready for dev Issues ready for development implementation.
Projects
None yet
Milestone
2024-04-30 - Apr Release
Development

No branches or pull requests
9 participants
@jcfranco @eriklharper @alisonailea @geospatialem @benelan @rpanichakit9541 @ethanbdev @anveshmekala @brittneytewks