Editing in grid rows

[GevorDanielyan]

I have an one question, about editing in grid row, how can I create inline editing in row, without edit button, just clicking in each cell.

@page "/multipliers"

@using Google.Protobuf.WellKnownTypes
@using Grpc.Core
@using GrpcService.BlazorUI.Models
@using Blazorise.DataGrid
@using MultipliersgRPCService
@inject MultipliersgRPCService.MultipliersService.MultipliersServiceClient _multipliersClient
@inject ILogger<Multipliers> _logger

<h3>Multipliers</h3>

<DataGrid TItem="MultipliersModel"
          Data="_multipliers"
          ReadData="@GetMarjaAsync"
          Editable="true"
          EditMode = "DataGridEditMode.Inline"
          Responsive>
    <DataGridCommandColumn TItem="MultipliersModel" />
    <DataGridColumn TItem="MultipliersModel" Field="@nameof(MultipliersModel.Symbol)" Caption="Symbol" Sortable="false" />
    <DataGridColumn TItem="MultipliersModel" Field="@nameof(MultipliersModel.Delta)" Caption="Delta(Marja)" Sortable="false" />
    <DataGridColumn TItem="MultipliersModel" Field="@nameof(MultipliersModel.Spread)" Caption="Spread" Sortable="false" />
    <DataGridColumn TItem="MultipliersModel" Field="@nameof(MultipliersModel.Cash_N_Cash)" Caption="Cash-N-Cash" Sortable="false" />
    <DataGridColumn TItem="MultipliersModel" Field="@nameof(MultipliersModel.CSBid)" Caption="CS Bid" Sortable="false" />
    <DataGridColumn TItem="MultipliersModel" Field="@nameof(MultipliersModel.CSAsk)" Editable="true" Caption="CS Ask" Sortable="false">

    </DataGridColumn>
</DataGrid>

@code {

    private List<MultipliersModel> _multipliers = new List<MultipliersModel>();

    private async Task GetMarjaAsync()
    {
        var emptyRequest = new Empty();
        try
        {
            using (var call = _multipliersClient.GetMarja(emptyRequest))
            {
                await foreach (var response in call.ResponseStream.ReadAllAsync())
                {
                    var multipliersResponse = new MultipliersModel
                        {
                            Symbol = response.Symbol,
                            Delta = response.Delta,
                            Spread = response.Marja,
                            Cash_N_Cash = response.Tarber,
                            CSBid = response.CSBid,
                            CSAsk = response.CSAsk
                        };
                    _multipliers.Add(multipliersResponse);
                }
            }
        }
        catch (RpcException ex) when (ex.StatusCode == StatusCode.Internal)
        {
            _logger.LogError(ex.Message);
            throw;
        }
    }
}

This is my component, I need be able edit each DataGridColumn and when I edit some cell value, I need to call my custom method to save values(I have this method). Thanks in advance

[stsrki]

You can bind the event on RowClicked. And then call dataGridRef.Edit(item);

We have many APIs opened on DataGrid that you can explore with intellisense. Save included.

[GevorDanielyan]

How I can do that in my case? If it is not difficult, you can write an example? Thanks.

[stsrki]

First, define a member variable to hold the grid reference

private DataGrid dataGridRef;

the assign it

<DataGrid @ref="@dataGridRef" >

after that, you can call its methods

• await dataGridRef.Edit(someSelectedItem); this will change the grid into edit mode
• await dataGridRef.Save(); this will save any changes
• etc.