Grid.MVC的分页不起作用

时间:2014-09-02 14:57:22

标签: ajax asp.net-mvc gridview kendo-grid

我在我的MVC Web应用程序中使用Grid.MVC 在带有索引控制器的空白页面中进行测试时,它可以通过分页和过滤成功运行。 当我把它放在我的项目中时,问题就会产生 我做的步骤,我做ajax请求(因为我不需要重新加载页面)到方法并返回包含Grid.Mvc搜索结果的部分视图结果和页数返回成功,但当我按下到下一页或过滤它不起作用。

代码:

查看:

@using (Ajax.BeginForm("Search", "Home",
        new AjaxOptions
        {
            HttpMethod = "POST",
            InsertionMode = InsertionMode.Replace,
            UpdateTargetId = "SearchResult"
        })){
@Html.DropDownList("Province", "Province")
@Html.DropDownList("Cities", "Cities")
<span>price from :</span>    <input type="text" name="Pricefrom" />
<span>to :</span>           <input type="text" name="Priceto" />
    <input type="submit" value="Search" />      }

搜索控制器:

   [HttpPost]
    public ActionResult Search(int? page , int Province = 0, int Cities = 0, int Pricefrom = 0, int Priceto = 0)
    {
        var ads = db.Ad.Where(a => (Cities == 0 || a.CityId == Cities) &&
                                   (Province == 0 || a.Cities.ProvinceId == Province)&&
                                   (Pricefrom == 0 || a.Price >= Pricefrom)&&
                                   (Priceto == 0 || a.Price <= Priceto)).OrderBy(a => a.AdDate).ToList();

        return PartialView("_Search", ads);
    }

PartialView:

@using GridMvc.Html
@model IEnumerable<Semsark.Areas.Backend.Models.Ad>
<div>
@Html.Grid(Model).Columns(columns =>
        {
            columns.Add(c => c.Id).Titled("ID");
            columns.Add(c => c.AdTitle).Titled("title");
            columns.Add(c => c.AdBody).Titled("body");
        }).WithPaging(2).Sortable(true)
</div>

查看index.cshtml中的脚本和样式:

<head>
<meta name="viewport" content="width=device-width" />
<link href="@Url.Content("~/Content/Gridmvc.css")" rel="stylesheet" />
<script src="@Url.Content("~/Scripts/gridmvc.min.js")"></script>
<script src="~/Scripts/gridmvc.lang.ru.js"></script>
<title>Index</title>

提前感谢您的帮助,

3 个答案:

答案 0 :(得分:1)

@*Webgrid using Paging in mvc 4.

View Page **.cshtml**  *@

    @model MvcPopup.Models.PagedEmployeeModel

    @{
        //ViewBag.Title = "SearchEmployee";
        Layout = null;
    }

    @{
        WebGrid grid = new WebGrid(rowsPerPage: Model.PageSize);
        grid.Bind(Model.Employee,
                  autoSortAndPage: false,
                  rowCount: Model.TotalRows
        );
    }

    @grid.GetHtml(
        fillEmptyRows: false,
        alternatingRowStyle: "alternate-row",
        headerStyle: "grid-header",
        footerStyle: "grid-footer",
        mode: WebGridPagerModes.All,
                firstText: "<< First",
                previousText: "< Prev",
                nextText: "Next >",
                lastText: "Last >>",
        columns: new[] {


            grid.Column("Name",
                        header: "Name",
                        format: @<text>
                            @Html.ActionLink((string)item.Name, "ViewEmployeeDetail", new { id = item.id }, new { @class = "viewDialog" })</text>
                        ),
            grid.Column("Department"),
             grid.Column("City"),
              grid.Column("State"),
           grid.Column("Country",
                        header: "Country"
            ),
             grid.Column("Mobile"),
            grid.Column("",
                        header: "Actions",
                        format: @<text>
                            @Html.ActionLink("Edit", "EditEmployee", new { id = item.id }, new { @class = "editDialog" })
                            |

                            @Html.ActionLink("Delete", "Delete", new { id = item.id }, new { @class = "confirmDialog"})
                        </text>
            )
    })

@*-----------------------------------
Model folder under modelservices.cs file
=================================*@

    public IEnumerable<Employee> GetEmployeePage(int pageNumber, int pageSize, string searchCriteria)
            {
                if (pageNumber < 1)
                    pageNumber = 1;

                return db.Employees 
                    .OrderBy(m =>m.Name)
                  .Skip((pageNumber - 1) * pageSize)
                  .Take(pageSize)
                  .ToList();
            }
             public int CountAllEmployee()
            {
                return db.Employees.Count();
            }
            public class PagedEmployeeModel
        {
            public int TotalRows { get; set; }
            public IEnumerable<Employee> Employee { get; set; }
            public int PageSize { get; set; }
        }

@*Controller folder under create file like employeecontroller.cs *@

    using MvcPopup.Models;
    using System.Globalization;
    using System.Text;

    namespace MvcPopup.Controllers
    {
        public class EmployeeController : Controller
        {
            //
            // GET: /Employee/
            ModelServices mobjModel = new ModelServices();
            public ActionResult Index()
            {
                return View();
            }
            public ActionResult SearchEmployee(int page = 1, string sort = "name", string sortDir = "ASC")
            {
                const int pageSize = 5;
                var totalRows = mobjModel.CountAllEmployee(); 

                sortDir = sortDir.Equals("desc", StringComparison.CurrentCultureIgnoreCase) ? sortDir : "asc";

                var validColumns = new[] { "id", "name", "department", "country" };
                if (!validColumns.Any(c => c.Equals(sort, StringComparison.CurrentCultureIgnoreCase)))
                    sort = "id";

                var employee = mobjModel.GetEmployeePage(page, pageSize, "it." + sort + " " + sortDir);

                var data = new PagedEmployeeModel()
                {
                    TotalRows = totalRows,
                    PageSize = pageSize,
                    Employee = employee
                };
                return View(data);
            }
    ------------------------

答案 1 :(得分:0)

您是否曾尝试通过IQueryable列表而不是IEnumerable?根据文档,Gridmvc.Html需要IQueryable进行分页。 IQueryable和IEnumerable之间存在一些微妙的差异,可能会有所不同。

答案 2 :(得分:0)

分页需要这些脚本:

 "~/Scripts/GridMvc/URI.js"
 "~/Scripts/GridMvc/gridmvc.min.js"
 "~/Scripts/GridMvc/gridmvc-ext.js"