Here's a workaround
@currPage
<TelerikGrid Data=@MyData EditMode="@GridEditMode.Inline" Pageable="true" Height="500px"
OnDelete="@DeleteHandler" @bind-Page="@currPage" PageSize="@pageSize">
<GridToolBar>
<GridCommandButton Command="Add" Icon="add">Add Employee</GridCommandButton>
</GridToolBar>
<GridColumns>
<GridColumn Field=@nameof(SampleData.ID) Title="ID" Editable="false" />
<GridColumn Field=@nameof(SampleData.Name) Title="Name" />
<GridCommandColumn>
<GridCommandButton Command="Delete" Icon="delete">Delete</GridCommandButton>
</GridCommandColumn>
</GridColumns>
</TelerikGrid>
@code {
int currPage { get; set; } = 1; // required for the workaround - we use it to put the grid on the previous page where there is data
int pageSize { get; set; } = 10; // defaults to 10 anyway, showcases the logic and concept
async Task DeleteHandler(GridCommandEventArgs args)
{
SampleData item = (SampleData)args.Item;
// perform actual data source operation here through your service
MyData.Remove(item);
// workaround for deleting all items on the last page
// we check if we're on the last page and if there are no items for it
// if so - then we've deleted all of them and need to switch back to the previous page
int totalPagesOfData = MyData.Count / pageSize;
bool isOnLastPage = currPage > totalPagesOfData;
bool noItemsOnLastPage = MyData.Count % pageSize == 0;
if (isOnLastPage && noItemsOnLastPage)
{
currPage = currPage > 1 ? --currPage : 1;
}
}
// in a real case, keep the models in dedicated locations, this is just an easy to copy and see example
public class SampleData
{
public int ID { get; set; }
public string Name { get; set; }
}
public List<SampleData> MyData { get; set; }
protected override void OnInitialized()
{
MyData = new List<SampleData>();
for (int i = 1; i < 23; i++)
{
MyData.Add(new SampleData()
{
ID = i,
Name = "Name " + i.ToString()
});
}
}
}
Regards,
Marin Bratanov
Progress Telerik
I'm attaching here a short video that demonstrates the issue as well for clarity.
Regards,
Marin Bratanov
Progress Telerik