DxDropDownBox.InputId Property
Specifies a unique identifier (ID) of the editor’s input element.
Namespace: DevExpress.Blazor
Assembly: DevExpress.Blazor.v24.1.dll
NuGet Package: DevExpress.Blazor
Declaration
[DefaultValue(null)]
[Parameter]
public string InputId { get; set; }
Property Value
Type | Default | Description |
---|---|---|
String | null | A unique identifier. |
Remarks
The InputId
property value is assigned to the id attribute of the DropDownBox’s input element. The id
is case-sensitive, should contain at least one character, and should not contain whitespaces (spaces, tabs, etc.)
When you create a Form Layout component and add a DropDownBox to a layout item’s template, use the InputId
property to associate the DropDownBox with the layout item’s caption.
- Specify the layout item’s Caption property. A browser renders the caption as an HTML label element.
- Set the layout item’s CaptionFor property to a unique value. This value is assigned to the label’s for attribute.
- Set the editor’s
InputId
property to the same value as the item’sCaptionFor
.
Note
If you do not specify the CaptionFor
property, the Form Layout generates a random identifier (Guid ) and assigns it to the label’s for
attribute and to the id
property of the first input element in the template.
<DxFormLayout>
<DxFormLayoutItem Caption="Contact Name:" CaptionFor="dd_box">
<Template>
<DxDropDownBox InputId="dd_box" @bind-Value="Value" QueryDisplayText="QueryText">
<DropDownBodyTemplate Context="ddb_context">
<DxListBox... />
</DropDownBodyTemplate>
</DxDropDownBox>
</Template>
</DxFormLayoutItem>
@*...*@
</DxFormLayout>
You can click the associated label to focus the DropDownBox editor.