.net Mudblazor-MudDataGrid单元格点击事件

n53p2ov0 于 2023-04-13 发布在 .NET

关注(0)|答案(1)|浏览(182)

我正在构建一个blazor服务器应用程序，使用.NET Core 7和MudblazorUI组件库。我在寻找拦截行的单元格单击事件的方法时遇到了麻烦。我的主要目标是能够获得被单击的行单元格。我能够捕获行单击事件，但这不是我想要的。我需要用户单击的实际单元格，如果这是由组件提供的话。
我附加现有的blazor代码：

<MudDataGrid T="Element" MultiSelection="true" Items="@Elements" SortMode="SortMode.Multiple" QuickFilter="@_quickFilter"
                         Hideable="true" RowClick="@RowClicked" SelectedItemsChanged="@SelectedItemsChanged">
                <ToolBarContent>
                    <MudSpacer />
                    <MudTextField @bind-Value="_searchString" Placeholder="Table Search" Adornment="Adornment.Start" Immediate="true"
                                  AdornmentIcon="@Icons.Material.Filled.Search" IconSize="Size.Medium" Class="mt-0"></MudTextField>
                    <MudButton Style="background-color:coral;color:white;margin-left: 20px;" StartIcon="@Icons.Material.Filled.Add">
                        @if (!isMobileDevice)
                        {
                            <span>New Item</span>
                        }
                    </MudButton>
                </ToolBarContent>
                <Columns>
                    <SelectColumn T="Element" />
                    <PropertyColumn Property="x => x.SKU" Title="SKU Number" Sortable="true" Filterable="true" />
                    <PropertyColumn Property="x => x.Name" Title="Name" Sortable="true" Filterable="true" CellStyleFunc="@_cellStyleFunc" onclick="OnCellClick" />
                    <PropertyColumn Property="x => x.Quentity" Title="Qty On-Hand" Sortable="true" Filterable="true" />
                    <PropertyColumn Property="x => x.Measurement" Title="UOM" Sortable="true" Filterable="true" />
                    <PropertyColumn Property="x => x.Location" Title="Location" Sortable="true" Filterable="true" />
                    <PropertyColumn Property="x => x.Type" Title="Type" Sortable="true" Filterable="true" />
                    <TemplateColumn CellClass="justify-end">
                        <CellTemplate>
                            <MudMenu Icon="@Icons.Material.Filled.MoreVert" AnchorOrigin="@Origin.BottomLeft" TransformOrigin="@Origin.TopRight">
                                <MudMenuItem Icon="@Icons.Material.Outlined.Edit">Edit</MudMenuItem>
                                <MudMenuItem Icon="@Icons.Material.Outlined.ContentCopy">Duplicate</MudMenuItem>
                                <MudMenuItem Icon="@Icons.Material.Outlined.MultipleStop">Transfer Qty</MudMenuItem>
                                <MudMenuItem Icon="@Icons.Material.Outlined.Archive">Archive</MudMenuItem>
                            </MudMenu>
                        </CellTemplate>
                    </TemplateColumn>
                </Columns>
                <PagerContent>
                    <MudDataGridPager T="Element" />
                </PagerContent>
            </MudDataGrid>

我尝试在PropertyColumn标记处添加一个OnClick事件，但该事件没有被触发。我也搜索了文档，但似乎没有包含此功能的信息。我也在互联网上搜索过，但这也没有结果！
或者，我希望能够创建一个可单击的单元格，并通过接收行数据来响应单击事件。
任何帮助都将非常感谢，因为网格工作得非常好，开箱即用。

.net

来源：https://stackoverflow.com/questions/75937752/mudblazor-muddatagrid-cell-click-event

1条答案

按热度按时间

rjjhvcjd1#

您可以使用TemplateColumn〉CellTemplate〉显示组件。
然后，您可以在显示组件上添加@onclick事件。

<MudDataGrid T="MyObject" Items="@_myObjectsCollection" RowClick="@RowClicked">
    <TemplateColumn Title="Name">
        <CellTemplate>
            <MudText @onclick="@(()=>RowCellClicked(context.Item.Name))">@context.Item.Name</MudText>
        </CellTemplate>
    </TemplateColumn>
</MudDataGrid>

@code
{
    List<MyObject> _myObjectsCollection;

    void RowCellClicked(string name)
    {
        // cell clicked logic
    }
}

mudblazor Snippet

赞(0）回复(0）举报 2023-04-13

我来回答

.net Mudblazor-MudDataGrid单元格点击事件

1条答案

相关问题

热门标签

最新问答