We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy.
BoldDeskWe are launching BoldDesk on Product Hunt soon. Learn more & follow us.
Below I have a grid with Columns. The Operator column provides a dropdown list of operators to choose from but will only be editable if the respective row/object has its 'HasOperator' property set to true. For ex, only two rows' Operator column in the grid will be editable and the other 5 will not. The Operator Column is required, so this is where Validation comes in. When a row with 'HasOperator' is true, ValidationRules.Required should also be true and vice versa, however, this is not the case. How can my code be optimized to accomplish this feature?
<div class="content-wrapper">
<div class="row" style="margin-right: 0.2em; margin-top: 1em;">
<SfInPlaceEditor ValueChanged="@ValueChangeHandler" Value="@TableName" TValue="string" Mode="RenderMode.Inline" EditableOn="EditableType.EditIconClick" Type="Syncfusion.Blazor.InPlaceEditor.InputType.Text" ShowButtons="true" Disabled="false" SubmitOnEnter="true">
<EditorComponent>
<SfTextBox Value="@TableName" Placeholder="Enter a new Table Name"> </SfTextBox>
</EditorComponent>
</SfInPlaceEditor>
<SfGrid @ref="grid" TValue="DecimalAmountCriteriaDTO" Toolbar="@(new List<string>() { "Add", "Edit", "Update", "Cancel" })" AllowPaging="true">
<GridEvents TValue="DecimalAmountCriteriaDTO" OnActionFailure="@ActionFailure" RowSelected="RowSelectHandler"></GridEvents>
<SfDataManager Url="DecimalAmountCriteria" Adaptor="Adaptors.WebApiAdaptor" HttpClientInstance="@Http"></SfDataManager>
<GridPageSettings PageSize="8"></GridPageSettings>
<GridEditSettings NewRowPosition="NewRowPosition.Bottom" AllowAdding="true" AllowDeleting="true" AllowEditing="true" />
<GridColumns>
<GridForeignColumn TValue="OperatorDTO" Field=@nameof(DecimalAmountCriteriaDTO.OperatorId) HeaderText="Operator" EditType="EditType.DropDownEdit" Format="" AllowEditing="@dropDownEdit" ForeignKeyField="Id" ForeignKeyValue="Display" Width="150" ValidationRules="@dropDownValidation">
<SfDataManager Url="Operator" Adaptor="Adaptors.WebApiAdaptor" HttpClientInstance="@Http"></SfDataManager>
</GridForeignColumn>
</GridColumns>
</SfGrid>
</div>
</div>
<ToastComponent @ref="child" />
@code {
ToastComponent? child;
SfGrid<DecimalAmountCriteriaDTO>? grid;
ValidationRules dropDownValidation = new ValidationRules();
bool dropDownEdit;
public void RowSelectHandler(RowSelectEventArgs<DecimalAmountCriteriaDTO> args)
{
dropDownEdit = args.Data.HasOperator;
if (args.Data.HasOperator)
{
dropDownValidation.Required = true;
}
//dropDownValidation.Required = args.Data.HasOperator;
}
}
<style>
.drag-drop-tab .e-content .e-item {
padding: 10px;
text-align: justify;
}
</style>
Hi Jose,
Greetings from Syncfusion support
We suspect that you are expecting to toggle the validation rules property. Is so we suggest you to use ActionBegin Event of DataGrid. Here by using the request type we have changed the value of the required property. Kindly check the attached code snippet for your reference.
https://blazor.syncfusion.com/documentation/datagrid/events#onactionbegin
|
<SfGrid DataSource="@Orders" Toolbar="@(new List<string>() { "Add", "Edit", "Delete", "Update", "Cancel" })" Height="315"> <GridEditSettings AllowAdding="true" AllowEditing="true" AllowDeleting="true" Mode="EditMode.Normal"></GridEditSettings> <GridEvents OnActionBegin="ActionBegin" TValue="Order"></GridEvents> <GridColumns> <GridColumn Field=@nameof(Order.OrderID) HeaderText="Order ID" IsPrimaryKey="true" TextAlign="TextAlign.Right" Width="120"></GridColumn> <GridForeignColumn Field=@nameof(Order.EmployeeID) ValidationRules="@dropDownValidation" HeaderText="Employee Name" ForeignKeyValue="FirstName" ForeignDataSource="@Employees" Width="150"> <EditTemplate> <SfDropDownList ID="EmployeeID" @bind-Value="@((context as Order).EmployeeID)" TItem="EmployeeData" TValue="int?" DataSource="Employees" ShowClearButton="true"> <DropDownListFieldSettings Text="FirstName" Value="EmployeeID"></DropDownListFieldSettings> </SfDropDownList> </EditTemplate> </GridForeignColumn>
</GridColumns> </SfGrid>
@code { public List<Order> Orders { get; set; } public List<EmployeeData> Employees { get; set; } ValidationRules dropDownValidation = new ValidationRules();
int? dropDownEdit;
public void ActionBegin (ActionEventArgs<Order> args) { if (args.RequestType == Syncfusion.Blazor.Grids.Action.BeginEdit) { if (args.Data.OrderID.Equals(1001))
{
dropDownValidation.Required = true;
} } if (args.RequestType == Syncfusion.Blazor.Grids.Action.Save) { dropDownValidation.Required = false; } }
} |
Please let us know if you have any concerns.
Regards,
Monisha
I understand the logic, however, this only works on rows where HasOperator is set to true. I am not allowed to save if HasOperator is set to false.
Hi Jose,
Query: “ however, this only works on rows where HasOperator is set to true. I am not allowed to save if HasOperator is set to false. ”
In your previous update you have mentioned that the row will be edited only when HasOperator field is true ( but will only be editable if the respective row/object has its 'HasOperator' property set to true. ). We are quite unclear about your exact requirement. In our previously provided example we have changed the required value as true inside begin edit. So if the row with HasProperty true value will satisfy the condition and the validation will takes place and on pressing save we have changed the validation again to false. So for the column with HasProperty as false will not satisfy the condition.
If it is not satisfied then we suggest you to change the required value on the ActionComplete event of DataGrid rather than doing it in the update request type
Reference: https://blazor.syncfusion.com/documentation/datagrid/events#onactioncomplete
If you still face difficulties kindly share us an video demonstration of the issue and if possible kindly modify the below provided sample. So that it will be very helpful for us to validate the reported issue.
