Masked validate dd mm yyyy
Hi I would like to have a maskedEdit that handles dates. Below is a code snippet of what I have,
I would like to restrict the input to the user
- DD = must be numeric and cannot be >31
- MM =value must be between 1 and 12
-
DD/MM/YYYY (watermark) and when start typing they should see __/__/____/
- "/^(0?[1-9]|[12][0-9]|3[01])[\/](0?[1-9]|1[012])[\/](19|20)\d\d$/"
- "/^\d{2}\/\d{2}\/\d{4}$/"
Does your control handle regex or I am missing something? I see characters I should not be seeing?
<textInputLayout:SfTextInputLayout
WidthRequest="50" Margin="40"
TrailingViewPosition="Inside"
OutlineCornerRadius="5"
ContainerType="Outlined"
Hint="Birth Date"
IsHintAlwaysFloated="True"
ErrorText="{Binding ErrorText}"
HelperText="Required *">
<maskedEdit:SfMaskedEdit
ClearButtonVisibility="WhileEditing"
ValueMaskFormat="ExcludePromptAndLiterals"
Keyboard="Numeric"
MaskType="RegEx"
Mask="/^\d{2}\/\d{2}\/\d{4}$/"
Value="{Binding DateOfBirth}"
ValidationMode="KeyPress"
Watermark="DD/MM/YYYY"
WatermarkColor="LightGray"
WatermarkFontFamily="Arial"
WatermarkFontAttributes="Bold"
HasError="{Binding HasError}"
WatermarkFontSize="20" />
<textInputLayout:SfTextInputLayout.TrailingView>
<Label
Text="đź—“" FontSize="20">
</Label>
</textInputLayout:SfTextInputLayout.TrailingView>
</textInputLayout:SfTextInputLayout>
Any Suggestions?
thanks
|
MaskEdit 1:
<syncmaskededit:SfMaskedEdit x:Name="maskedEdit" MaskType="RegEx" Mask="(0?[1-9]|[12][0-9]|3[01])[\/](0?[1-9]|1[012])[\/](19|20)\d\d"/>
MaskEdit 2:
<syncmaskededit:SfMaskedEdit ClearButtonVisibility="WhileEditing" ValueMaskFormat="ExcludePromptAndLiterals" Keyboard="Numeric" MaskType="RegEx" Mask="\d{2}\/\d{2}\/\d{4}" ValidationMode="KeyPress" Watermark="DD/MM/YYYY" WatermarkColor="LightGray" WatermarkFontFamily="Arial" WatermarkFontAttributes="Bold" WatermarkFontSize="20" />
|
We would like to suggest that you modify the mask value to achieve your requirement. It can be resolved by using the `\/`​ instead of `[/]​` in Mask value as mentioned in the below code snippet,
[XAML]:
|
<syncmaskededit:SfMaskedEdit x:Name="maskedEdit" MaskType="RegEx" Mask="(0[1-9]|[12][0-9]|3[01])\/(0[1-9]|1[012])\/\d{4}"/> |
Screenshot:
Let us know if you need any further assistance.
Regards,
Sridevi S.
Hi
just noticed that the value is not properly filled, I only get the last four values .
If I type any date like 20/11/2021 in the lostFocus eventhandler I only see 2021 as value.
I was expecting to see the full date as string .
Am I missing the obvious?
public void OnLostFocus(object sender, FocusEventArgs e)
{
var sfMaskedEdit = sender as SfMaskedEdit;
var value = sfMaskedEdit.Value;
}
<StackLayout Margin="0, 100, 0, 0">
<textInputLayout:SfTextInputLayout
WidthRequest="50" Margin="40"
TrailingViewPosition="Inside"
OutlineCornerRadius="5"
ContainerType="Outlined"
Hint="Birth Date"
IsHintAlwaysFloated="True"
HelperText="Required *">
<syncmaskededit:SfMaskedEdit
ClearButtonVisibility="WhileEditing"
ValueMaskFormat="ExcludePromptAndLiterals"
Keyboard="Numeric"
MaskType="RegEx"
Mask="(0[1-9]|[12][0-9]|3[01])\/(0[1-9]|1[012])\/\d{4}"
ValidationMode="LostFocus"
Watermark="DD/MM/YYYY"
WatermarkColor="LightGray"
WatermarkFontFamily="Arial"
WatermarkFontAttributes="Bold"
Unfocused="OnLostFocus"
WatermarkFontSize="20" />
<textInputLayout:SfTextInputLayout.TrailingView>
<Label Text="đź—“" FontSize="20">
</Label>
</textInputLayout:SfTextInputLayout.TrailingView>
</textInputLayout:SfTextInputLayout>
</StackLayout>
thanks
