Megabit / Blazorise

Blazorise is a component library built on top of Blazor with support for CSS frameworks like Bootstrap, Tailwind, Bulma, AntDesign, and Material.
https://blazorise.com/
Other
3.26k stars 528 forks source link

How to set new Action on datagrid #335

Closed Saeidasadi32 closed 4 years ago

Saeidasadi32 commented 4 years ago

I write this code

@inject HttpClient Http
@inject SessionState.BorsState BorsState

<Card Margin="Margin.Is4.OnY">
    <CardHeader Class="text-center">
        <CardTitle><h4>لیست شرکت های بورسی</h4></CardTitle>
    </CardHeader>
    @if (vcomp == null)
    {
        <CardBody class="text-center">
            <img height="100" src="../../imag/loadingl.jpg" />
        </CardBody>
    }
    else
    {
        <CardBody Class="frtl">
            <div style="height:500px; overflow-y: scroll;">
                <DataGrid TItem="VCompany"
                          Data="@vcomp"
                          AllowSort=true
                          AllowFilter=true
                          ShowPager=true
                          PageSize="PageSize"
                          @bind-SelectedRow="@selectedVCompany"
                          Selectionchange="@SelectRowC"
                          IsBordered="true"
                          IsNarrow="true"
                          IsHoverable="true">
                    <ChildContent>
                        <DataGridCommandColumn TItem="VCompany">
                            <ClearFilterCommandTemplate>
                                <Button Color="Color.Warning" Clicked="@context.Clicked">حذف فیلتر</Button>
                            </ClearFilterCommandTemplate>
                        </DataGridCommandColumn>
                        <DataGridColumn TItem="VCompany" Field="@nameof(VCompany.CNamad)" Caption="نماد " Class="font-weight-bold" />
                        <DataGridColumn TItem="VCompany" Field="@nameof(VCompany.CName)" Caption="نام شرکت" />
                        <DataGridColumn TItem="VCompany" Field="@nameof(VCompany.GName)" Caption="گروه صنعت" />
                        <DataGridColumn TItem="VCompany" Field="@nameof(VCompany.BName)" Caption="عنوان بازار" />
                    </ChildContent>
                </DataGrid>
            </div>
        </CardBody>
    }
</Card>

@code {

    List<VCompany> vcomp;

    [Parameter] public int PageSize { get; set; } = 20;

    public VCompany selectedVCompany;

    [Parameter] public EventCallback<int> Selectionchange { get; set; }

    public Task SelectRowC()
    {
        return Selectionchange.InvokeAsync(selectedVCompany.CID);
    }

    protected override async Task OnInitializedAsync()
    {
        vcomp = await Http.GetJsonAsync<List<VCompany>>("api/VCompanies");
        BorsState.VCompanies = vcomp;
    }
}

but run with error how do i use datagrid with new action on blazor component I need in this component use datagride and after selected row return id from row selected

stsrki commented 4 years ago

You should set AllowEdit to true

https://blazorise.com/docs/extensions/datagrid/#editing