Specify DTO for inline editing?

[Joe Sperlak]

I'm currently working on a grid where I am allowing a user to edit a couple fields. Let's say the Grid is populated with List<SettingsDto> settings. The grid has three columns: Name, Description, and Value. When the user clicks the edit button they can then edit only the Description and Values fields. My API endpoint for updating takes a UpdateSettingsDto which just has ID, Description, and Value. Description and Value are using DataAnnotations to make them required.

Currently I am setting the ValidationRules="new ValidationRules() {Required = true}" and making the fields required. I am wondering if there is a way, when putting the grid into edit mode, to specify a different DTO class for the edit process than what the original data source type is so that it can follow the data annotations for validation?

Hopefully I explained this well enough, if not let me know and I will throw an example together.

[Monisha Saravanan]

Hi Joe,

Greetings from Syncfusion.

Query: “I am wondering if there is a way, when putting the grid into edit mode, to specify a different DTO class for the edit process than what the original data source type is so that it can follow the data annotations for validation?”

We suspect that you are expecting to implement complex column validation in Blazor DataGrid, If so we suggest you to use the ValidateComplexType attribute from data annotations. This allows you to perform validation on complex data binding columns.

Below is an example demonstrating how to use the ValidateComplexType attribute for the EmployeeName class and display a custom message in the "First Name" column using the RequiredAttribute of data annotation.

Here is the code snippet for implementing complex column validation. Kindly check the below attached code snippet and documentation for your reference.

Reference: https://blazor.syncfusion.com/documentation/datagrid/column-validation#validate-complex-column-using-data-annotation-attribute

 

<SfGrid DataSource="@Employees" Height="315" AllowSorting=true Toolbar="@(new List<string>() { "Add", "Edit", "Delete", "Update", "Cancel" })">

     <GridEditSettings AllowAdding="true" AllowEditing="true" AllowDeleting="true"></GridEditSettings>

    <GridColumns>

        <GridColumn Field="Name.FirstName" HeaderText="First Name" Width="150"></GridColumn>

       

    </GridColumns>

</SfGrid>

 

@code{

    public class EmployeeData

    {

        [Required]

        public int? EmployeeID { get; set; }

        [ValidateComplexType]

        public EmployeeName Name { get; set; }

        public string Title { get; set; }

    }

 

    public class EmployeeName

    {

        [Required(ErrorMessage ="First name should not be empty")]

        public string FirstName { get; set; }

        public string LastName { get; set; }

    }

}

If you are experiencing a different issue then kindly share us the below details to procced further from our end.

1. Share us the entire Grid code snippet along with model class.
2. Share us the video demonstration of the reported issue.

The above requested detail will be very helpful for us to validate the reported issue at our end.

Regards,

Monisha