Here in the index view is rendered the partial view:

<div class="tab-content col-sm-9 col-md-9">

@await Html.PartialAsync(@"Partials/Studies/History/_HistoryPartial", Model.Chronologies)

</div>

-------------------------------------------------------------------------------------------------------

Bellow is my partial view (with tab-panels) on which I want to create pagination:

@model List<ChronologyServiceModel>

@{

ViewData["Title"] = "_HistoryPartial";

}

<div class="well tab-pane fade col-md-10" id="historyDiv" role="tabpanel" aria-labelledby="history-tab">

<ul class="nav nav-tabs">

<li class="nav-item">

<a class="nav-link" data-toggle="tab" role="tab" id="historyTable1-tab" href="#historyTable1">History</a>

</li>

<li class="nav-item">

<a class="nav-link" data-toggle="tab" role="tab" id="historyTable-tab" href="#historyTable">Chronology</a>

</li>

</ul>

<div class="tab-content col-md-9">

<div class="tab-pane fade active in" id="historyTable1" role="tabpanel" aria-labelledby="historyTable1-tab">

<table style="width: 30%;" class="table table-hover table-custom">

<tbody>

@{

<tr>

<th>Activity</th>

<th>Count</th>

<th>Hours</th>

</tr>

foreach (var c in Model.Select(x => x.SubjectName).Distinct())

{

<tr>

<td>@c</td>

<td>@Model.Where(x => x.SubjectName == c).Count()</td>

</tr>

}

}

</tbody>

</table>

</div>

<div class="tab-pane fade" id="historyTable" role="tabpanel" aria-labelledby="historyTable-tab">

<table style="width: 30%;" class="table table-hover table-custom">

<tbody>

<tr>

<th>Activity</th>

<th>Start</th>

<th>End</th>

</tr>

@{

if (Model.Any())

{

foreach (var chr in Model)

{

<tr>

<td>@chr.SubjectName</td>

<td>@chr.Date.AddMinutes(-25.0).ToString("HH:mm:ss")</td>

<td>@chr.Date.ToString("HH:mm:ss")</td>

</tr>

}

}

}

</tbody>

</table>

</div>

</div>

</div>

In the traditional way with PagedList the whole page rerenders and it doesn't work for partial views. So how do I do it in the best way?