Podświetlanie wybranego wiersza w komponencie DataGrid

0

Dzień dobry,
jak zrobić aby po wybraniu wiersza w komponencie DataGrid we frameworku Blazor podświetal się on np: kolorem niebieskim?

<MudDataGrid Items="@ListOfCustomers" QuickFilter="@_quickFilter" SortMode="SortMode.Multiple" MultiSelection="false"  >
    <Columns >
        <PropertyColumn Property="x => x.Imie" Title="Imię:" />
        <PropertyColumn Property="x => x.Nazwisko" Title="Nazwisko:"/>
        <PropertyColumn Property="x => x.Telefon" Title="Numer telefonu:"/>
    
    </Columns>
    <ToolBarContent>
        <MudText Typo="Typo.h6">Baza Kontrahentów:</MudText>
        <MudSpacer />
        <MudTextField @bind-Value="_searchstring" Placeholder="Szukaj" Adornment="Adornment.Start" Immediate="true"
                      AdornmentIcon="@Icons.Material.Filled.Search" IconSize="Size.Medium" Class="mt-0"></MudTextField>
    </ToolBarContent>
</MudDataGrid>
0

Próbowałeś to zmienić za pomocą tego?

RowClick, RowStyleFunc
0

@jarzi: z Coś tam robiłem ale nie wyszło. Wieczorkiem przysiądę do tego jeszcze raz.

0
virusek391 napisał(a):

Dzień dobry,
jak zrobić aby po wybraniu wiersza w komponencie DataGrid we frameworku Blazor podświetal się on np: kolorem niebieskim?

<MudDataGrid Items="@ListOfCustomers" QuickFilter="@_quickFilter" SortMode="SortMode.Multiple" MultiSelection="false"  >
    <Columns >
        <PropertyColumn Property="x => x.Imie" Title="Imię:" />
        <PropertyColumn Property="x => x.Nazwisko" Title="Nazwisko:"/>
        <PropertyColumn Property="x => x.Telefon" Title="Numer telefonu:"/>
    
    </Columns>
    <ToolBarContent>
        <MudText Typo="Typo.h6">Baza Kontrahentów:</MudText>
        <MudSpacer />
        <MudTextField @bind-Value="_searchstring" Placeholder="Szukaj" Adornment="Adornment.Start" Immediate="true"
                      AdornmentIcon="@Icons.Material.Filled.Search" IconSize="Size.Medium" Class="mt-0"></MudTextField>
    </ToolBarContent>
</MudDataGrid>

Aktualizacja:
Oto rozwiązanie które działa u mnie :) Chodzi o wykorzystanie SelectedRowClassFunc w RowClassFunc.

<style>
    .selected {
        background-color: #1E88E5 !important;
    }

        .selected > td {
            color: white !important;
        }

            .selected > td .mud-input {
                color: white !important;
            }
</style>

<MudDataGrid T="Kontrahent" ReadOnly="false" Hover="true" @ref="mudTable" RowClassFunc="@SelectedRowClassFunc" Items="@ListOfCustomers.Take(15)"  RowClick="@RowClicked" QuickFilter="@_quickFilter" SortMode="SortMode.Multiple" MultiSelection="false">
    <Columns >
        <PropertyColumn Property="x => x.Imie" Title="Imię:" />
        <PropertyColumn Property="x => x.Nazwisko" Title="Nazwisko:"/>
        <PropertyColumn Property="x => x.Telefon" Title="Numer telefonu:"/>
  
        <TemplateColumn  CellClass="d-flex justify-end">
            <CellTemplate>
                <MudIconButton Size="@Size.Small" Icon="@Icons.Material.Outlined.Edit" OnClick="@context.Actions.StartEditingItemAsync" />
            </CellTemplate>
        </TemplateColumn>

@code 
{
  private string SelectedRowClassFunc(Kontrahent element, int rowNumber)
  {
      if (selectedRowNumber == rowNumber)
      {
          selectedRowNumber = -1;
       
     
          return string.Empty;
      }
      else if (mudTable.SelectedItem != null && mudTable.SelectedItem.Equals(element))
      {
          selectedRowNumber = rowNumber;
    
          return "selected";
      }
      else
      {
          return string.Empty;
      }
  
  }
}
0

Możesz też znaleźć styl CSS dla zaznaczonego wiersza i to napisać. Wtedy będzie działało z buta dla wszystkich gridów w aplikacji.

1 użytkowników online, w tym zalogowanych: 0, gości: 1