How to add validation for inline editing?

[Bogdan]

Hi guys,

I have a grid with inline editing and I want to add some custom validation, as you can check below.

<TelerikGrid Data="@Model.Equipments"
             EditMode="GridEditMode.Inline"
             OnUpdate="@OnUpdate"
             OnCreate="@OnCreate"
             OnDelete="@OnDelete">
    <GridToolBarTemplate>
        <GridCommandButton Command="Add">Add new equipment</GridCommandButton>
    </GridToolBarTemplate>
    <GridColumns>
<GridColumn Field="@nameof(Equipment.Code)"
                    Title="Code">
            <EditorTemplate>
                @{
                    Equipment item = (Equipment)context;
                }
                <div class="k-form-field-wrap">
                    <TelerikTextBox @bind-Value="item.Code" />
                    <TelerikValidationMessage For="@(() => item.Code)" />
                </div>
            </EditorTemplate>
        </GridColumn>
        <GridColumn Field="@nameof(Equipment.Name)"
                    Title="Name">
            <EditorTemplate>
                @{
                    Equipment item = (Equipment)context;
                }
                <div class="k-form-field-wrap">
                    <TelerikTextBox @bind-Value="item.Name" />
                    <TelerikValidationMessage For="@(() => item.Name)" />
                </div>
            </EditorTemplate>
        </GridColumn>       
        <GridCommandColumn Width="185px">
            <GridCommandButton Command="Edit">Edit</GridCommandButton>
            <GridCommandButton Command="Delete">Delete</GridCommandButton>
            <GridCommandButton Command="Save" ShowInEdit="true">Save</GridCommandButton>
            <GridCommandButton Command="Cancel" ShowInEdit="true">Cancel</GridCommandButton>
        </GridCommandColumn>
    </GridColumns>
</TelerikGrid>

private void OnCreate(GridCommandEventArgs args)
{
    Equipment item = (Equipment)args.Item!;

    item.Id = Guid.CreateVersion7();

    Model.Equipments.Add(item);
}

private void OnUpdate(GridCommandEventArgs args)
{
    Equipment item = (Equipment)args.Item!;

    int indexToUpdate = Model.Equipments.FindIndex(e => e.Id == item.Id);

    if (indexToUpdate != -1)
    {
        Model.Equipments[indexToUpdate] = item;
    }
}

private void OnDelete(GridCommandEventArgs args)
{
    Equipment item = (Equipment)args.Item!;

    int indexToRemove = Model.Equipments.FindIndex(e => e.Id == item.Id);

    if (indexToRemove != -1)
    {
        Model.Equipments.RemoveAt(indexToRemove);
    }
}

public sealed class Equipment
{
    public Guid Id { get; set; }

    [Required]
    public string? Name { get; set; }

    [Required]
    public string? Code { get; set; }
}

If I don't fill in the Name or Code, I and I hit Save, I can see the validation message under the corresponding column in the row that is in edit mode. So far so good.

However, say that I want the code to be unique. How to I tackle this one? I would like to see a validation message under the Code textbox "That code already exists", or whatever the message might be.

Any guidance on the recommended approach here would be great—thanks!

Regards,

Bogdan

[Dimo]

Hello Bogdan,

Consider the following alternative options:

• Implement a custom DataAnnotationsValidator. It may be a bit cumbersome or difficult to retrieve the current collection of Codes inside the IsValid() method.
• Verify the uniqueness in the OnUpdate handler and cancel the event conditionally. You will also need to show a custom validation message, as this validation will not go through the standard .NET validation mechanism.

Regards,
Dimo
Progress Telerik

[Bogdan]

Hi Dimo,

Thanks for the quick reply and the suggestions.

Since what I want is not possible, I will just stick with displaying the message in a pop-up.

Regards,

Bogdan