Grid in-line edit and validator

Radzen.Blazor Components
1

What I ran into was the fact that even though a validator on a column triggered correctly, when I called my save method in the EditTemplate for the row the incorrect data saved. I got around that by writing a method that checks the data before allowing it to save.

My question is this, is there any property/method on the grid that allows me to detect that a validator has failed? I've looked and I don't see anything like that. If not, it would be nice to be able to. If I've taken the time to put validators on my grid, I don't want to have to write that logic again to bail out of the save.

I'm currently using version 3.5.3

2

This isn't supposed to happen. The RowUpdate event should not trigger if there are validation errors. Can you reproduce this problem on our online demo?

3

One difference I'm noting is @onclick:stopPropagation="true" that you have on your button that I don't. What is its purpose?

4

It prevents the button from selecting the row.

5

This is my grid definition.

<RadzenGrid @ref="badgeGrid" AllowFiltering="true" FilterCaseSensitivity="FilterCaseSensitivity.CaseInsensitive" AllowPaging="true" PageSize="15"
            AllowSorting="true" Data="@badges" TItem="Badge" ColumnWidth="200px">
    <Columns>
        <RadzenGridColumn TItem="Badge" Property="ImageName" Title="Name">
            <EditTemplate Context="conferenceBadge">
                <RadzenTextBox @bind-Value="conferenceBadge.ImageName" Style="width:100%; display: block" Name="ImageName" />
                <RadzenRequiredValidator Text="Image name is required" Component="ImageName" Popup="true" />
            </EditTemplate>
        </RadzenGridColumn>
        <RadzenGridColumn TItem="Badge" Property="Image" Title="Image" Sortable="false" Filterable="false">
            <Template Context="conferenceBadge">
                <RadzenImage Path=@(GetImage(conferenceBadge)) Style="max-width: 125px; max-height: 125px; display: block;"
                             Click="@(args => dialogService.Open<DialogManageBadgeImage>($"Manage Image for {conferenceBadge.ImageName}",
                          new Dictionary<string, object>() { { "Badge", conferenceBadge } },
                          new DialogOptions(){ Width = "800px", Height = "600px" }))" />
            </Template>
        </RadzenGridColumn>

        <RadzenGridColumn TItem="Badge" Context="badgeEdit" Bubble="false" Filterable="false" Sortable="false" TextAlign="TextAlign.Center" Width="100px">
            <Template Context="conferenceBadge">
                <RadzenButton Icon="edit" Size="ButtonSize.Medium" Click="@(args => EditRow(conferenceBadge))">
                </RadzenButton>
            </Template>
            <EditTemplate Context="conferenceBadge">
                <RadzenButton
                              Icon="save"
                              Size="ButtonSize.Medium"
                              Disabled="IsInvalidRow(conferenceBadge)"
                              Click="@((args) => SaveRow(conferenceBadge))">
                </RadzenButton>
                <RadzenButton
                              Icon="cancel"
                              Size="ButtonSize.Medium"
                              ButtonStyle="ButtonStyle.Secondary"
                              Click="@((args) => CancelEdit(conferenceBadge))">
                </RadzenButton>
            </EditTemplate>
        </RadzenGridColumn>
    </Columns>
</RadzenGrid>

As you can see I have a required on the ImageName column. If I leave the field blank, I get the text showing under the box that the field is required. When the button that represents save is clicked, the SaveRow function is still called. I got around it by making the Disabled propery point to a function

6

You haven't implemented inline editing as you are supposed to. Check that our online demo uses the RowUpdate method to perform the actual update - as I said before it won't fire unless validation succeeds. Your code does not handle RowUpdate at all.

7

Hi, I'm posting here, because I currently have a problem with validations when editing inline. Validation doesn't seem to occur and this can be reproduced on your demo page - column "SHIP NAME" has a RadzenRequiredValidator but validation message is not shown on save.

8

We are aware of the issue and are working on a fix.

9

Sorry for not posting sooner. So if I have to have a RowUpdate handler, is there any point in having a validator on the individual columns?

10

We have landed a fix and it will be part of the next Radzen.Blazor release. Still you need to have a RowUpdate handler as in the online demo.

Also the problem appears in RadzenDataGrid whereas you seem to be using RadzenGrid where validation works currently.

11

There still seems to be a problem with this, and it is easily reproducible on your demo page. Save row gets called everytime the check gets clicked even if the row is invalid. Your code will set the partClassToInsert = null on a save, which will cause the add button to be enabled and allow you to create a new row. This is a problem I'm currently running into and trying to figure out how to fix it, but I have no idea how to check for valid object without checking every field, which sort of defeats the purpose of having a validator!

To reproduce, click Add new row,
delete all fields that you can edit in the row - should be blank already
press the check mark to try to save...notice the errors appear, but now the add new row button is enabled again!
Click the add new row button, a new row will be added to the grid and the previous row with invalid data is now saved in the grid. The OnCreateRow will eventually get called on subsequent add row and check mark clicks to allow bad data to get saved.