Skip to main content

DxRegExMaskProperties.MaskAutoCompleteMode Property

Specifies the automatic value completion mode.

Namespace: DevExpress.Blazor

Assembly: DevExpress.Blazor.v24.1.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. 0 is the default character for placeholders that accept numeric values. For placeholders that accept letters, a is the default character.

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.

Regular Expression Masks - Strong Autocompletion Mode

If a user adds r to the editor’s value, the component completes the input and displays March:

Regular Expression Masks - Strong Autocompletion Mode

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:

Regular Expression Masks - Optimistic Autocompletion Mode

See Also