Does using a EditTemplate for GridColumn override the Validation message display using a custom validator class?

[Jose]

Column Validation in Blazor DataGrid Component | Syncfusion

Cell Edit Types in Blazor DataGrid Component | Syncfusion

I am using a Custom Validator component to validate fields in a row, as well as using an EditTemplate with a SFNumericTextbox inside this EditTemplate for a grid column. However, I noticed that after implementing the edit template, the messages from the Validator class do NOT appear after they would before. However, the red-outline for a cell appears correctly on an improper entry, and I am not allowed to save a row with improper validation (that I defined in the code). This works fine, It's just the messages will not appear. Is this a known issue?

[Balamurugan Lakshmanan]

Hi Jose,

Greeting from Syncfusion Support.

Query: "I noticed that after implementing the edit template, the messages from the Validator class do NOT appear after they would before. "

We could not be able to reproduce the reported issue at our end while preparing the sample as per your suggestion. We have attached the sample file and screenshot for your reference. Kindly refer the attachments to resolve your issues.

And also we request you to define the ID property to custom editor element to match the column field value. Please refer the below attached links.

Reference: Column Validation in Blazor DataGrid Component | Syncfusion

                    Column Validation in Blazor DataGrid Component | Syncfusion

Please get back to us if you have further queries.

Regards,

Bala.

[Balamurugan Lakshmanan]

Kindly refer the below attached sample file for your reference. 

Attachment: BlazorApp1_332c9934.zip

[Jose]

My custom validator works. It is just the messages, or the tooltips, do not display at all, which is not ideal. Can you reupload the screenshot you posted?

 <SfGrid TValue="Program" Toolbar="@(new List<string>() { "Add", "Edit", "Delete", "Update" ,"Cancel" })" AllowPaging="true">

                <SfDataManager Url="Program")" Adaptor="Adaptors.WebApiAdaptor"></SfDataManager>

                <GridEditSettings NewRowPosition="NewRowPosition.Bottom" AllowAdding="true" AllowDeleting="true" AllowEditing="true">

                    <Validator>

                        @{

                            ValidatorTemplateContext txt = context as ValidatorTemplateContext;

                        }

                        <Validator context="@txt"></Validator>

                        <ValidationMessage For="@(() => (txt!.Data as Program)!.Rate)"></ValidationMessage>

                        <ValidationMessage For="@(() => (txt!.Data as Program)!.BRate)"></ValidationMessage>

                        <ValidationMessage For="@(() => (txt!.Data as Program)!.SRate)"></ValidationMessage>

                    </Validator>

                </GridEditSettings>

                <GridColumns>

                    <GridColumn Field=@nameof(Program.RecordId) HeaderText="RecordId" Visible="false" IsPrimaryKey="true" AllowEditing="false" ValidationRules="@(new ValidationRules { Required = true})" />

                    <GridColumn Field=@nameof(Program.Title) HeaderText="Title" EditType="EditType.DefaultEdit" />

                    <GridColumn Field=@nameof(Program.Rate) HeaderText="Rate" EditType="EditType.DefaultEdit" Type="ColumnType.String" Format="P6" ValidationRules="@(new ValidationRules{ Required= true } )">

                        <EditTemplate>

                            @{

                                var Context = (context as Program);

                                <SfNumericTextBox TValue="decimal" Format="###.#####'%'" Step=".01M" @bind-Value="@(Context.Rate)">

                                    <NumericTextBoxEvents TValue="decimal"></NumericTextBoxEvents>

                                </SfNumericTextBox>

                            }

                        </EditTemplate>

                    </GridColumn>

                    <GridColumn Field=@nameof(Program.BRate) HeaderText="BRate" EditType="EditType.DefaultEdit" Format="P6" ValidationRules="@(new ValidationRules{ Required= true })">

                        <EditTemplate>

                            @{

                                var Context = (context as Program);

                                <SfNumericTextBox TValue="decimal" Format="###.#####'%'" Step=".01M" @bind-Value="@(Context.BRate)">

                                    <NumericTextBoxEvents TValue="decimal"></NumericTextBoxEvents>

                                </SfNumericTextBox>

                            }

                        </EditTemplate>

                    </GridColumn>

                    <GridColumn Field=@nameof(Program.SRate) HeaderText="SRate" EditType="EditType.DefaultEdit" Format="P6">

                        <EditTemplate>

                            @{

                                var Context = (context as BonusProgram);

                                <SfNumericTextBox TValue="decimal" Format="###.#####'%'" Step=".01M" @bind-Value="@(Context.SRate)">

                                    <NumericTextBoxEvents TValue="decimal" ></NumericTextBoxEvents>

                                </SfNumericTextBox>

                            }

                        </EditTemplate>

                    </GridColumn>

                </GridColumns>

            </SfGrid>

[Jose]

                        <EditTemplate>

                            @{

                                var Context = (context as Program);

                                <SfNumericTextBox TValue="decimal" Format="###.#####'%'" Step=".01M" @bind-Value="@(Context.BaseRate)"/>

                                <DataAnnotationsValidator></DataAnnotationsValidator>

                            }

                        </EditTemplate>

I found that using  DataAnnotationsValidator gives me the message that you add inside of the 

messageStore inside of the custom component class outlined in the example you provided. However, I still would rather have a tooltip message display. Which is still not happening.

[Balamurugan Lakshmanan]

Hi Jose, 

From your query, we understood that you need to display the Tooltip message in Custom validator component. We have prepared the simple sample for your reference. Kindly refer the attached sample file , Ug documentation and Screenshot to resolve your issues.

Reference Link: https://blazor.syncfusion.com/documentation/datagrid/column-validation#display-validation-message-using-in-built-tooltip

Please get back to us if you have further queries.

Attachment: BlazorApp1_93aa88a8.zip