DxTextBoxSettings Class
Contains settings of an auto-generated text box editor.
Namespace: DevExpress.Blazor
Assembly: DevExpress.Blazor.v24.2.dll
NuGet Package: DevExpress.Blazor
Declaration
public class DxTextBoxSettings :
DxButtonEditSettings,
ITextBoxSettings,
IButtonEditSettings,
ITextEditSettings,
IEditSettings
Remarks
The DxTextBoxSettings
class contains settings of auto-generated text editors displayed in edit cells, filter row, inline, and pop-up edit forms.
Auto-Generated Text Box in Filter Row and Edit Cells
Grid and TreeList components automatically generate editors for columns based on their data types. For the String type, they generate the text box editor. Use properties of the DxTextBoxSettings
class to customize settings of auto-generated text box editors. To apply these settings, specify a DxTextBoxSettings
object in a column’s EditSettings
property.
Note that if you specify text box settings for a column containing non-string values, these settings have no effect and the component renders a read-only text box editor.
@inject EmployeeService EmployeeData
<DxGrid Data="@employees" PageSize="4" ShowFilterRow="true"
EditMode="GridEditMode.EditRow" KeyFieldName="ID">
<Columns>
<DxGridCommandColumn />
<DxGridDataColumn FieldName="FirstName" >
<EditSettings>
<DxTextBoxSettings ClearButtonDisplayMode="DataEditorClearButtonDisplayMode.Auto" />
</EditSettings>
</DxGridDataColumn>
<DxGridDataColumn FieldName="LastName" >
<EditSettings>
<DxTextBoxSettings ShowValidationIcon="true" NullText="Type a name" />
</EditSettings>
</DxGridDataColumn>
<DxGridDataColumn FieldName="BirthDate" />
<DxGridDataColumn FieldName="HireDate" />
<DxGridDataColumn FieldName="Email" />
</Columns>
</DxGrid>
Auto-Generated Text Box in Edit Forms
You can display an auto-generated column editor in the inline or pop-up edit form. Call the GetEditor
method to get the column editor in the edit form template.
<style>
.gray-style {
border-width: 1px;
border-color: gray;
background-color: #ECECEC;
}
</style>
<DxGrid Data="@employees" PageSize="4" KeyFieldName="ID"
EditMode="GridEditMode.EditForm">
<Columns>
<DxGridCommandColumn />
<DxGridDataColumn FieldName="FirstName" >
<EditSettings>
<DxTextBoxSettings CssClass="gray-style" />
</EditSettings>
</DxGridDataColumn>
<DxGridDataColumn FieldName="LastName" >
<EditSettings>
<DxTextBoxSettings CssClass="gray-style" />
</EditSettings>
</DxGridDataColumn>
<DxGridDataColumn FieldName="BirthDate" />
<DxGridDataColumn FieldName="HireDate" />
<DxGridDataColumn FieldName="Email" />
<DxGridDataColumn FieldName="Notes" Visible="false" >
<EditSettings>
<DxMemoSettings Rows="3" ResizeMode="MemoResizeMode.Disabled" />
</EditSettings>
</DxGridDataColumn>
</Columns>
<EditFormTemplate Context="EditFormContext">
<DxFormLayout >
<DxFormLayoutItem Caption="First Name:" ColSpanMd="6">
@EditFormContext.GetEditor("FirstName")
</DxFormLayoutItem>
<DxFormLayoutItem Caption="Last Name:" ColSpanMd="6">
@EditFormContext.GetEditor("LastName")
</DxFormLayoutItem>
<DxFormLayoutItem Caption="Birth Date:" ColSpanMd="6">
@EditFormContext.GetEditor("BirthDate")
</DxFormLayoutItem>
<DxFormLayoutItem Caption="Hire Date:" ColSpanMd="6">
@EditFormContext.GetEditor("HireDate")
</DxFormLayoutItem>
<DxFormLayoutItem Caption="E-mail:" ColSpanMd="12">
@EditFormContext.GetEditor("Email")
</DxFormLayoutItem>
<DxFormLayoutItem Caption="Notes:" ColSpanMd="12">
@EditFormContext.GetEditor("Notes")
</DxFormLayoutItem>
</DxFormLayout>
</EditFormTemplate>
</DxGrid>
@code {
Employee[]? employees;
protected override async Task OnInitializedAsync() {
employees = await EmployeeData.GetData();
}
//...
}
Runtime Customization
At runtime, call the GetColumnEditSettings
method to access settings of a text box in the specified column. The following code snippet dynamically disables the editor.
<DxGrid @ref="grid" Data="@employees" KeyFieldName="ID" EditMode="GridEditMode.EditRow" >
<Columns>
<DxGridCommandColumn />
<DxGridDataColumn FieldName="FirstName" />
<DxGridDataColumn FieldName="LastName" />
<DxGridDataColumn FieldName="BirthDate" />
<DxGridDataColumn FieldName="HireDate" />
<DxGridDataColumn FieldName="Email" />
</Columns>
</DxGrid>
<DxButton Text="Disable the Name" Click="Button_Click" />
@code {
IGrid grid { get; set; }
Employee[]? employees;
protected override async Task OnInitializedAsync() {
employees = await EmployeeData.GetData();
}
void Button_Click() {
var firstNameEditSettings = grid.GetColumnEditSettings<ITextBoxSettings>("FirstName");
var lastNameEditSettings = grid.GetColumnEditSettings<ITextBoxSettings>("LastName");
grid.BeginUpdate();
firstNameEditSettings.Enabled = false;
lastNameEditSettings.Enabled = false;
grid.EndUpdate();
}
}