Implement server side processing and Ajax interaction for the Grid.MVC plugin

I am working on an asp.net mvc web application and I want to use the Grid.MVC plugin found at this link http://gridmvc.codeplex.com/ . So I did the following: -

From NuGet package, I have installed Grid.MVC in my project.

I added the following in my opinion: -

 @model IEnumerable<WebApplication30.Models.Employee>
    @using GridMvc.Html
    @{
        ViewBag.Title = "Index";
    }

    <h2>Index</h2>

    <p>
        @Html.ActionLink("Create New", "Create")
    </p>
    <div style="width:500px;">
        @Html.Grid(Model).Columns(columns =>
    {

        columns.Add(c => c.FName).Titled(Html.DisplayNameFor(model => model.FName).ToString()).Filterable(true);
        columns.Add(c => c.LName).Titled(Html.DisplayNameFor(model => model.LName).ToString()).Filterable(true);
                            columns.Add(c => c.Dept.DeptName).Titled("deptname").Filterable(true);;
                        }).WithPaging(3).Sortable(true)
    </div>

      

The model looks like this: -

public partial class Employee
    {
        public int Id { get; set; }
        [Display(Name = "First Name")]
        public string FName { get; set; }
        [Display(Name = "Last Name")]
        public string LName { get; set; }
        public int DeptID { get; set; }

        public virtual Dept Dept { get; set; }
    }

      

And the controller: -

 public ActionResult Index()
        {
            var employees = db.Employees.Include(e => e.Dept);
            return View(employees.ToList());
        }

      

Column + column sorting works well now. But I ran into these problems: -

  • Sorting the paging + column will cause a complete page reload. Can I specify Ajax based interaction?

  • The paging + column sort will be done on the client side, so every time I visit the view I get all the data from the database. so there is a way to do it server side.

+3


source to share





All Articles