How to get all grid rows cell data of a grid with column checkbox marked checked, in a loop in Blazor server app .

Posted 2 years ago by sudhirThokchom
Edited 2 years ago
0
How can i get all  grid rows cell data of a grid column checkbox marked checked, in a loop in Blazor server app . 
* my custom gridview is called here *



            <ContentTemplate>
                @if (filteredEmployeeList != null)
                {
                    <button @onclick="@(async()=> { await GeneratePdf(); })">
                        Export to PDF
                    </button>
                    <button @onclick="@(async()=> { await GenerateExcel(); })">
                        Export to Excel
                    </button>

                    <GridView Items="filteredEmployeeList" ReloadList="IsGridViewFiltered">
                        <GridColumns>
                            <GridColumnCus ColumnTitle="EmployeeID" ColumnCount="0"
                                        OnSearchTextChanged="@(e => OnEmployeeSearchTextChanged(e, "EmployeeID"))"></GridColumnCus>
                            <GridColumnCus ColumnTitle="Name" ColumnCount="1"
                                        OnSearchTextChanged="@(e => OnEmployeeSearchTextChanged(e, "Name"))"></GridColumnCus>
                            <GridColumnCus ColumnTitle="Present Address" ColumnCount="2"
                                        OnSearchTextChanged="@(e => OnEmployeeSearchTextChanged(e, "PresentAddress"))"></GridColumnCus>
                            <AuthorizeView Roles="Admin" Policy="ActiveUser" >
                                <Authorized>
                                    <GridColumnCus ColumnTitle="Actions" ColumnCount="3"></GridColumnCus>
                                </Authorized>
                            </AuthorizeView>
                        </GridColumns>
                        <GridRow Context="employee">
                            <td>
                                <NavLink href=@string.Format("/authors/authordetail/{0}", employee.EmployeeID)>
                                    @employee.EmployeeID
                                </NavLink>
                            </td>
                            <td>@employee.Name</td>
                            <td>@employee.PresentAddress</td>
                            <AuthorizeView Roles="Admin" Policy="ActiveUser">
                                <Authorized>
                                    <td>
                                        <button type="button" class="btn btn-primary btn-sm" @onclick="(() => EditEmployee(employee))"><i class="lnr lnr-pencil"></i>&nbsp;Edit</button> &nbsp;
                                        <button type="button" class="btn btn-primary btn-sm" @onclick="(() => DeleteEmployee(employee.EmployeeID))"><i class="lnr lnr-trash"></i>&nbsp;Delete</button>
                                    </td>
                                </Authorized>
                            </AuthorizeView>
                        </GridRow>
                    </GridView>}
            </ContentTemplate>

 

*my gridview component*

@typeparam TItem





    <table id="example"  class="table table-striped table-bordered nowrap" style="width:100%">

        <thead class="bg-info">

            <tr>

                @GridColumns

            </tr>

        </thead>

        <tbody>

            @foreach (var item in ItemList)

            {

            <tr>

               @GridRow(item)

            </tr>

            }

        </tbody>

    </table>





<br />

<div>

    <button class="btn btn-secondary" @onclick="@(e => NavigateTo("first"))">@("<<")</button>

    <button class="btn btn-secondary" @onclick="@(e => NavigateTo("prev"))">Prev</button>

    @for (int i = 0; i < TotalPages; i++)

    {

        var pageNumber = i;

        <button class="btn @(CurrentPage == pageNumber? "btn-dark":"btn-info")"

                @onclick="@(e => UpdateList(pageNumber))">

            @(i + 1)

        </button>

    }

    <button class="btn btn-secondary" @onclick="@(e => NavigateTo("next"))">Next</button>

    <button class="btn btn-secondary" @onclick="@(e => NavigateTo("last"))">@(">>")</button>

</div>



@code {



    [Parameter]

    public RenderFragment GridColumns { get; set; }



    [Parameter]

    public RenderFragment<TItem> GridRow { get; set; }



    [Parameter]

    public List<TItem> Items { get; set; }



    public List<TItem> ItemList { get; set; }



    public int PageSize { get; set; }

    public int TotalPages { get; set; }

    public int CurrentPage { get; set; }



    [Parameter]

    public bool ReloadList { get; set; }



    protected override void OnInitialized()

    {

        PageSize = 5;



        if (Items != null)

        {

            ItemList = Items.Take(PageSize).ToList();

            TotalPages = (int)Math.Ceiling(Items.Count() / (decimal)PageSize);

        }



        base.OnInitialized();

    }



    protected override void OnAfterRender(bool firstRender)

    {

        if (!firstRender && ReloadList)

        {

            UpdateList();

            ReloadList = false;



            StateHasChanged();

        }



        base.OnAfterRender(firstRender);

    }



    private void UpdateList(int pageNumber = 0)

    {

        if (Items != null)

        {

            //pageNumber * pageSize -> take 5

            ItemList = Items.Skip(pageNumber * PageSize).Take(PageSize).ToList();

            TotalPages = (int)Math.Ceiling(Items.Count() / (decimal)PageSize);

            CurrentPage = pageNumber;

        }

    }



    private void NavigateTo(string direction)

    {

        if (direction == "prev" && CurrentPage != 0)

            CurrentPage -= 1;

        if (direction == "next" && CurrentPage != TotalPages - 1)

            CurrentPage += 1;

        if (direction == "first")

            CurrentPage = 0;

        if (direction == "last")

            CurrentPage = TotalPages - 1;



        UpdateList(CurrentPage);

    }



}

 

* my grid search box is created using this component*

@if (ColumnCount <= 1)
{
    <th >

        @ColumnTitle
        @if (ColumnTitle != "Actions")
        {
            <input class="form-control" placeholder="search" @oninput="OnSearchTextChanged" />
        }
    </th>
}
else
{
    <th  class="none">

        @ColumnTitle
        @if (ColumnTitle != "Actions")
        {
            <input class="form-control" placeholder="search" @oninput="OnSearchTextChanged" />
        }
    </th>

}

@code {

    [Parameter]
    public int ColumnCount { get; set; }

    [Parameter]
    public string ColumnTitle { get; set; }

    [Parameter]
    public EventCallback<ChangeEventArgs> OnSearchTextChanged { get; set; }

}
Someone is typing...

Post a Reply

You must be logged in to add a new post.
Number of online users: 0
An error has occurred. This application may no longer respond until reloaded. Reload 🗙