Column Validation in Blazor DataGrid Component
Question:
When I enter a value for the "CustomerID" column, it is required to validate the "Freight" column. On the contrary, if I do not enter a value for the "CustomerID" column, it is not required to validate the "Freight" column
Code:
<SfGrid DataSource="@Orders" Height="315" AllowPaging="true" Toolbar="@(new List<string>() { "Add", "Edit", "Delete", "Update", "Cancel" })">
<GridEditSettings AllowAdding="true" AllowEditing="true" AllowDeleting="true"></GridEditSettings>
<GridColumns>
<GridColumn Field=@nameof(Order.OrderID) HeaderText="Order ID" IsPrimaryKey="true" TextAlign="TextAlign.Right" Width="120"></GridColumn>
<GridColumn Field=@nameof(Order.CustomerID) HeaderText="Customer Name" Width="120"></GridColumn>
<GridColumn Field=@nameof(Order.OrderDate) HeaderText=" Order Date" EditType="EditType.DatePickerEdit" Format="d" TextAlign="TextAlign.Right" Width="130" Type="ColumnType.Date"></GridColumn>
<GridColumn Field=@nameof(Order.Freight) HeaderText="Freight" Format="C2" TextAlign="TextAlign.Right" Width="120"></GridColumn>
</GridColumns>
</SfGrid>
@code {
public List<Order> Orders { get; set; }
protected override void OnInitialized()
{
Orders = Enumerable.Range(1, 75).Select(x => new Order()
{
OrderID = 1000 + x,
CustomerID = (new string[] { "ALFKI", "ANANTR", "ANTON", "BLONP", "BOLID" })[new Random().Next(5)],
Freight = 2.1 * x,
OrderDate = DateTime.Now.AddDays(-x),
}).ToList();
}
public class Order
{
public int? OrderID { get; set; }
[NullAttribute]
public string CustomerID { get; set; }
public DateTime? OrderDate { get; set; }
[NullAttribute]
public double? Freight { get; set; }
}
public class NullAttribute : ValidationAttribute
{
protected override ValidationResult IsValid(object? value, ValidationContext validationContext)
{
if (value != null)
{
return ValidationResult.Success!;
}
else
{
return new ValidationResult("Not null!");
}
}
}
}
Hi Duong Quoc,
Based on your requirement to modify the code to validate the
"Freight" column based on whether a value is entered for the
"CustomerID" column, you need to customize the ValidationAttribute.
Create a custom validation attribute that checks if the "Freight"
column should be validated based on the value of the "CustomerID"
column. This approach ensures that the "Freight" column is validated
only when the "CustomerID" column has a value. If the "CustomerID"
is empty, the "Freight" column is not required. Kindly refer to the
code snippet and sample below for your reference.
|
<SfGrid DataSource="@Orders" Height="315" AllowPaging="true" Toolbar="@(new List<string>() { "Add", "Edit", "Delete", "Update", "Cancel" })">
<GridEditSettings AllowAdding="true" AllowEditing="true" AllowDeleting="true"></GridEditSettings>
-------------- </SfGrid>
@code {
public class Order
{
public int? OrderID { get; set; }
[NullAttribute]
public string CustomerID { get; set; }
public DateTime? OrderDate { get; set; }
[FreightValidation]
public double? Freight { get; set; }
}
public class FreightValidation : ValidationAttribute { protected override ValidationResult IsValid(object? value, ValidationContext validationContext) {
var order = (Order)validationContext.ObjectInstance;
if (!string.IsNullOrWhiteSpace(order.CustomerID)) { return new ValidationResult("Freight is required when CustomerID is provided."); } else { return ValidationResult.Success; }
} }
public class NullAttribute : ValidationAttribute
{
protected override ValidationResult IsValid(object? value, ValidationContext validationContext) {
if (!string.IsNullOrWhiteSpace(value.ToString()))
{
return ValidationResult.Success!;
}
else
{
return new ValidationResult("Not null!");
}
}
}
} |
Reference: https://blazor.syncfusion.com/documentation/datagrid/column-validation#custom-validation
Regards,
Prathap Senthil
Attachment: BlazorApp1_16bedfcf.zip
- 1 Reply
- 2 Participants
-
DQ Duong Quoc
- Aug 14, 2024 08:17 AM UTC
- Aug 15, 2024 12:13 PM UTC
