Masking: Add DateMask and support Mask in DatePicker #3874
Merged
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Codecov Report
@@ Coverage Diff @@
## dev #3874 +/- ##
==========================================
+ Coverage 91.04% 91.12% +0.07%
==========================================
Files 350 351 +1
Lines 11462 11603 +141
==========================================
+ Hits 10436 10573 +137
- Misses 1026 1030 +4
Continue to review full report at Codecov.
|
ghost
reviewed
Feb 6, 2022
| mask.CaretPos = 4; | ||
| mask.ToString().Should().Be("12/3|1/99"); | ||
| mask.Delete(); | ||
| mask.ToString().Should().Be("12/3|1/9"); |
There was a problem hiding this comment.
I'm not sure about the following use case:
- Write
12/3|1/99 - I wanted to type
12/30/99so I press delete - Now I have
12/3|1/9so I press 0. - But the year is now
12/30|/19
Maybe the mask should autocorrect on blur?
There was a problem hiding this comment.
The same happens here: https://nosir.github.io/cleave.js/ in the date example, but I agree that this is not exactly desirable behavior.
Some of the autocorrection while typing is pretty useful though. like typing 5599 results in 05/05/99.
So maybe this kind of autocorrection should be applied only when typing at the end of the text?
There was a problem hiding this comment.
@henon Autocorrection is very cool and time saving.
What about theses rules?
- When typing, autocorrect if the preceding date part is completed or constrained.
- When pressing delete or backspace, don't autocorrect.
- When the mask is fully filled, autocorrect the whole date.
Scenarios :
- With a mask
MM/dd/yyyy- When pressing 5, autocorrect to 05.
- Press 4, autocorrect to 04
- Press 2018
- With a mask
MM/dd/yy- Enter 10420 gives 10/04/20
- Move cursor 10/0|4/20
- Press delete
- Press backspace
- Type 12
- It gives 10/12/20
There was a problem hiding this comment.
@naster01 I agree and I plan to do this in a followup PR.
2 tasks
|
This should close #3892 |
henon
changed the title
jammerware
pushed a commit
to jammerware/MudBlazor
that referenced
this pull request
Sep 20, 2022
* DateMask * Fixed mask examples for small screens * Add datemask example to docs * MudPicker: support Masking * Docs: DatePicker masking examples
jammerware
pushed a commit
to jammerware/MudBlazor
that referenced
this pull request
Sep 20, 2022
* DateMask * Fixed mask examples for small screens * Add datemask example to docs * MudPicker: support Masking * Docs: DatePicker masking examples
jammerware
pushed a commit
to jammerware/MudBlazor
that referenced
this pull request
Sep 20, 2022
* DateMask * Fixed mask examples for small screens * Add datemask example to docs * MudPicker: support Masking * Docs: DatePicker masking examples
jammerware
pushed a commit
to jammerware/MudBlazor
that referenced
this pull request
Sep 20, 2022
* DateMask * Fixed mask examples for small screens * Add datemask example to docs * MudPicker: support Masking * Docs: DatePicker masking examples
3dots
pushed a commit
to 3dots/MudBlazor
that referenced
this pull request
Mar 23, 2023
* DateMask * Fixed mask examples for small screens * Add datemask example to docs * MudPicker: support Masking * Docs: DatePicker masking examples
ferraridavide
pushed a commit
to ferraridavide/MudBlazor
that referenced
this pull request
May 30, 2023
* DateMask * Fixed mask examples for small screens * Add datemask example to docs * MudPicker: support Masking * Docs: DatePicker masking examples
ilovepilav
pushed a commit
to ilovepilav/MudBlazor
that referenced
this pull request
Nov 25, 2023
* DateMask * Fixed mask examples for small screens * Add datemask example to docs * MudPicker: support Masking * Docs: DatePicker masking examples
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
closes #3892
Adds a date mask algorithm that works exactly like Cleave.js's date mask.
How Has This Been Tested?
unit
Types of changes
Checklist:
dev).