Stop page refresh after filtering grid in mvc.grid

Question

I am using Mvc.Grid (Grid.MVC5), I want to stop its page refresh which is automatically called after using any filter. Is it possible?

View :-

@model IEnumerable< MVC6_Grid_with_filters.Models.SchemeMaster>
@using NonFactors.Mvc.Grid;
@{
    Layout = null;
}

< link href="@Url.Content("~/Content/MvcGrid/mvc-grid.css")" rel="stylesheet" />
< script src="~/Scripts/jquery-2.1.4.min.js">< /script>
< script src="~/Scripts/MvcGrid/mvc-grid.js" type="text/javascript">< /script>

@(Html
.Grid(Model)
.Build(columns =>
{
    columns.Add(c => c.SchemeID).Titled("SchemeID");
    columns.Add(c => c.SchemeName).Titled("SchemeName");
    columns.Add(c => c.city).Titled("City Name");
    columns.Add(o => o.CompanyName).Titled("Company Name");
    columns.Add(c => c.Createddate, "Createddate").Titled("Date");
    columns.Add(c => c.Married).Titled("Married");
})
.Filterable()
.Sortable()
.Pageable()
)
<script>
    $('.mvc-grid').mvcgrid();
</script>

hasan · Accepted Answer · 2017-06-15T08:17:29.327

2

You can use @Html.AjaxGrid with your partial view

Controller:

[HttpGet]
public ActionResult Index()
{
    // Only main string query values will be visible here.
    return View();
}

[HttpGet]
public ActionResult IndexGrid()
{
    var list = GetSchemeMasters(); // Your custom list method to get SchemeMasters
    return PartialView("YourPartialView", PeopleRepository.GetPeople());
}

Main View:

@Html.AjaxGrid(Url.Action("YourPartialAction"))

Your Partial View:

@model IEnumerable< MVC6_Grid_with_filters.Models.SchemeMaster>

@(Html
    .Grid(Model)
    .Build(columns =>
    {
        columns.Add(c => c.SchemeID).Titled("SchemeID");
        columns.Add(c => c.SchemeName).Titled("SchemeName");
        columns.Add(c => c.city).Titled("City Name");
        columns.Add(o => o.CompanyName).Titled("Company Name");
        columns.Add(c => c.Createddate, "Createddate").Titled("Date");
        columns.Add(c => c.Married).Titled("Married");
    })
    .Pageable()
    .Filterable()
    .Sortable()
)

edited Jun 15 '17 at 08:17

answered Jun 15 '17 at 07:49

hasan

3,484
1
16
23

thanks @Hasan, actually I have used this already but after using it i dont get filters overs grid, and if i call $('.mvc-grid').mvcgrid() on partial view then it again refreshes page.. – Sunil Chaudhary Jun 15 '17 at 08:16
now, i have only paging and sorting in my page which not refreshing url but i want filters as well.. – Sunil Chaudhary Jun 15 '17 at 08:19
can you try to add columns.Add(model => model.YourField).Titled("YourField").Filterable(true); – hasan Jun 15 '17 at 09:23
thanks @Hasan, actually it was mvc-grid.css problem I write it in bundle and now its working.. – Sunil Chaudhary Jun 15 '17 at 09:44
Can we call @Html.AjaxGrid(Url.Action("YourPartialAction")) using jquery??? – Sunil Chaudhary Jun 15 '17 at 09:54
1

I did not try it before. You can try something like this @Html.Raw(Html.AjaxGrid(Url.Action("YourPartialAction"))) in jquery but i am not sure whether it works – hasan Jun 15 '17 at 10:12

Stop page refresh after filtering grid in mvc.grid

1 Answers1