DxRegExMaskProperties.MaskAutoCompleteMode Property
Specifies the automatic value completion mode.
Namespace: DevExpress.Blazor
Assembly: DevExpress.Blazor.v24.2.dll
NuGet Package: DevExpress.Blazor
Declaration
[DefaultValue(MaskAutoCompleteMode.Strong)]
[Parameter]
public MaskAutoCompleteMode MaskAutoCompleteMode { get; set; }
Property Value
Type | Default | Description |
---|---|---|
MaskAutoCompleteMode | Strong | A MaskAutoCompleteMode enumeration value. |
Available values:
Name | Description |
---|---|
None | The autocomplete feature is disabled. A user should type each character into the edit box. |
Strong | Each time a user types a character, the editor determines if the following placeholder can be filled. If only one character matches the mask, the editor displays this character and moves the caret forward. |
Optimistic | When a user enters a character in the empty edit box for the first time, the editor fills all the placeholders with the default values. |
Remarks
Use the MaskAutoCompleteMode
property to enable automatic value completion. If enabled, the editor tries to complete a value that has been partially entered by a user.
Strong Mode
Strong
is the default completion mode.
<DxMaskedInput @bind-Value="Value"
Mask="\R{MonthNames}"
MaskMode="MaskMode.RegEx" />
@code{
string Value { get; set; }
}
For example, if a user types the letter M
in an editor whose mask is \R{MonthNames}
, the editor automatically displays the letter a
after it because March and May start with the letter M
, and the second letter is ‘a’ in both cases.
If a user adds r
to the editor’s value, the component completes the input and displays March
:
Optimistic Mode
The following code snippet enables the Optimistic
completion mode.
<DxMaskedInput @bind-Value="Value"
Mask="\R{MonthNames}"
MaskMode="MaskMode.RegEx">
<DxRegExMaskProperties MaskAutoCompleteMode="MaskAutoCompleteMode.Optimistic" />
</DxMaskedInput>
@code{
string Value { get; set; }
}
For example, if a user types the letter M
in an editor whose mask is set to \R{MonthNames}
, the editor completes the value and sets it to May
. Only ‘March’ and ‘May’ are possible completions and the editors selects the shorter alternative. The control also selects the letter ‘y’ so that a user can change it: