NonFactors Paging issue following search - asp.net

Question

I am using NonFactors mvcgrid6 (https://mvc6-grid.azurewebsites.net/) in my project and Paging is breaking following a search. When selecting Page 2 for example after a search has been made the whole data set is returned and not just the searched data.
Looking for a way to persist the searched for data when using the paging. Is this possible to do with this plugin?
Controller
public IActionResult Index(IndexResidentVM searchValues)
{
var indexVm = new IndexResidentVM()
{
SearchItems = _residentService.GetAllResidents(searchValues).AsQueryable(),
Groups = _groupService.GetGroups(),
Users = _userService.GetUsers()
};
return View(indexVm);
}
Index
#using CommunityContact.Core.Enums
#using NonFactors.Mvc.Grid
#model CommunityContact.Core.ViewModels.Resident.IndexResidentVM
#{
ViewData["Title"] = "Residents";
}
<h3>Allocated Residents</h3>
<form asp-action="Index" id="indexSearchForm">
<div class="form-row">
<div class="form-group col-md-3" style="margin-top: 15px;">
<label class="col-md-3">Group: </label>
<select id="indexGroupDdl" asp-for="Group" asp-items="#Model.Groups.Select(p => new SelectListItem()
{
Value = p.Name,
Text = p.Name
})" class="form-control-sm col-md-8">
<option selected="selected" value="">Please select </option>
</select>
</div>
<div class="form-group col-md-4" style="margin-top: 15px;">
<label class="col-md-4">RAG Status:</label>
<select id="indexRagStatusDdl" asp-for="RagStatus" asp-items="Html.GetEnumSelectList<Enums.RagStatus>()" class="form-control-sm col-md-6">
<option selected="selected" value="">Please select </option>
</select>
</div>
<div class="form-group col-md-4" style="margin-top: 15px;">
<label class="col-md-4">Allocated to: </label>
<select id="indexAllocatedToDdl" asp-for="User" asp-items="#Model.Users.Select(p => new SelectListItem()
{
Value = p.Name,
Text = p.Name
})" class="form-control-sm col-md-6">
<option selected="selected" value="">Please select </option>
</select>
</div>
<div class="col-md-1" style="margin-top: 15px;">
<button id="clearSearch" class="btn-sm btn-primary clear-search" title="Clear Search"><span class="fa fa-times"></span></button>
</div>
</div>
</form>
<hr />
#(Html.Grid(Model.SearchItems)
.Build(columns =>
{
columns.Add(model => model.Id).Css("hidden-column");
columns.Add(model => model.ResidentId).Titled("Resident ID");
columns.Add(model => model.Forename1).Titled("Forename");
columns.Add(model => model.Surname).Titled("Surname");
columns.Add(model => model.Group).Titled("Group");
columns.Add(model => model.CallBackDue.HasValue ? model.CallBackDue.Value.ToShortDateString() : string.Empty).Titled("Call Back Due");
columns.Add(model => model.RagStatus).Titled("RAG Status");
columns.Add(model => model.AllocatedTo).Titled("Allocated to");
columns.Add(model => Html.ActionLink(" ", "Edit", "Resident", new { id = model.Id }, new { #class = "fa fa-edit", title = "Edit" })).Css("archive-column-width");
columns.Add(model => Html.ActionLink(" ", " ", new {}, new {#class="fa fa-archive", href ="#", onclick="return archivePrompt('"+ model.Id +"')", title ="Archive"})).Css("archive-column-width");
})
.Pageable()
.RowAttributed(model => new {#class = model.RagStatus == Enums.RagStatus.Red.ToString() ? "rag-status-red" : model.RagStatus == Enums.RagStatus.Amber.ToString() ? "rag-status-amber" : model.RagStatus == Enums.RagStatus.Green.ToString() ? "rag-status-green" : null }))
#*#Html.AjaxGrid(Url.Action("Index"))*#
#section Scripts
{
<script>
// MvcGrid
[].forEach.call(document.getElementsByClassName('mvc-grid'), function (element) {
new MvcGrid(element);
});
</script>
}
View Model
public class IndexResidentVM
{
public int Id { get; set; }
public string ResidentId { get; set; }
public string Forename1 { get; set; }
public string Surname { get; set; }
public string Group { get; set; }
public string User { get; set; }
public Enums.Enums.RagStatus RagStatus { get; set; }
public IQueryable<ResidentSearchItemVM> SearchItems { get; set; }
public IEnumerable<EditUserVM> Users { get; set; }
public IEnumerable<GroupVM> Groups { get; set; }
}

Answer 1

This was solved by making the call to the controller a GET request and not POST. Adding the following to my form tag fixed it for me -
method="GET"