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
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> Edit</button>
<button type="button" class="btn btn-primary btn-sm" @onclick="(() => DeleteEmployee(employee.EmployeeID))"><i class="lnr lnr-trash"></i> 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