MVC的NuGet页PagedList链接无法正常工作 [英] Nuget MVC PagedList Page Links not working correctly

查看:112
本文介绍了MVC的NuGet页PagedList链接无法正常工作的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有一个简单的视图模型,我要显示一个列表页面。我跟着<一个href=\"http://www.asp.net/mvc/tutorials/getting-started-with-ef-using-mvc/sorting-filtering-and-paging-with-the-entity-framework-in-an-asp-net-mvc-application\"相对=nofollow>这个教程分页我的列表页面。 Heere是我的控制器code,它返回IPagedList期

 公开的ViewResult指数(INT?页)
{
    清单&LT; ProjectViewModel&GT; projectList =新的List&LT; ProjectViewModel&GT;();
    的foreach(在db.Projects工程项目)
    {
        projectList.Add(ProjectViewModel.ConvertToProjectViewModel(项目));
    }
    VAR PAGENUMBER =页面? 1;
    返回查看(projectList.ToPagedList(PAGENUMBER,3));
}

下面是我的看法,这与寻呼机渲染以及正确呈现:

  @using PagedList.Mvc;
@using PagedList;
@model PagedList.IPagedList&LT; LayoutTest.ViewModels.ProjectViewModel&GT;&LT;链接HREF =/内容/ PagedList.css的rel =stylesheet属性类型=文/ CSS/&GT;&LT;脚本&GT;
$(函数(){
  $(div.progressbar2),进度条({值:92});
  $(div.progressbar)。每个(函数(){
      VAR元=这一点;
      $(元素).progressbar({
          值形式:parseInt($(元素).attr(数据最后的价值))
      });
  });
});
&LT; / SCRIPT&GT;
@foreach(以型号VAR项)
{
   &LT; D​​IV CLASS =列表容器&GT;
    &LT; D​​IV CLASS =列表的图像&GT;
        &所述; IMG SRC =@ item.ProjectLogo宽度=300HEIGHT =225/&GT;
    &LT; / DIV&GT;
    &LT; D​​IV CLASS =列表标题&​​GT;
        @ Html.DisplayFor(modelItem =&GT; item.Title)
    &LT; / DIV&GT;
    &LT; D​​IV CLASS =名单民容器&GT;
        &LT; D​​IV CLASS =名单民左&GT;
            业主:待定
        &LT; / DIV&GT;
        &LT; D​​IV CLASS =名单敏右&GT;
            费用:$@Html.DisplayFor(modelItem =&GT; item.EstimatedCost)
        &LT; / DIV&GT;
    &LT; / DIV&GT;
    &LT; D​​IV CLASS =名单简讯&GT;
        @ Html.DisplayFor(modelItem =&GT; item.Brief)
    &LT; / DIV&GT;
    &LT; D​​IV CLASS =名单民容器&GT;
        &LT; D​​IV CLASS =名单民左&GT;
                        位置 - 待定
        &LT; / DIV&GT;
        &LT; D​​IV CLASS =名单敏右&GT;
            @ Html.DisplayFor(modelItem =&GT; item.EndDate)
        &LT; / DIV&GT;
    &LT; / DIV&GT;
    &LT; D​​IV CLASS =进度的数据,去年值=@ item.StartDate.Date.Month&GT;
        &LT; D​​IV CLASS =进步标签&GT; @ item.StartDate.Date.Month%完成&LT; / DIV&GT;
    &LT; / DIV&GT;
 &LT; / DIV&GT;
}@ Html.PagedListPager((IPagedList)型号,网页= GT; Url.Action(指数,新的{PAGE}))

然而,当我点击寻呼机导航到另一个页面没有任何反应,没有错误信息或任何东西。有没有人遇到类似的事情?

编辑:

以下是从PagedListPager输出的HTML

 &LT; D​​IV CLASS =分页PagedList寻呼机&GT;
 &LT; UL&GT;&LT;李班=previous禁用PagedList-skipTo previous&GT;&LT; A&GT;&安培; larr; previous&LT; / A&GT;&LT; /李&GT;
     &LT;李班=主动&GT;&LT; A&GT; 1 LT; / A&GT;&LT; /李&GT;
     &LT;立GT;&LT; A HREF =/项目页= 1?&GT; 2'; / A&GT;&LT; /李&GT;
     &LT;李班=下一个PagedList-skipToNext&GT;&LT; A HREF =/项目页= 1?&gt;接下来&安培; RARR;&LT; / A&GT;&LT; /李&GT;
 &LT; / UL&GT;&LT; / DIV&GT;


解决方案

我用客户方调试,Chrome和发现有被禁用所有锚(preventDefault)JavaScript函数。由于列表实现IEnumerable数据源的罚款。现在分页按预期工作。在code一直很好。如果它可以帮助任何人。

I have a simple ViewModel that I want to display as a list page. I followed this tutorial for paging my list page. Heere is my controller code that returns a view with IPagedList

public ViewResult Index(int? page)
{
    List<ProjectViewModel> projectList = new List<ProjectViewModel>();
    foreach (Project project in db.Projects)
    {
        projectList.Add(ProjectViewModel.ConvertToProjectViewModel(project));
    }
    var pageNumber = page ?? 1;
    return View(projectList.ToPagedList(pageNumber, 3));
}

Below is my view, that renders correctly with the pager rendering as well:

@using PagedList.Mvc;
@using PagedList;
@model PagedList.IPagedList<LayoutTest.ViewModels.ProjectViewModel>

<link href="/Content/PagedList.css" rel="stylesheet" type="text/css" />

<script>
$(function() {
  $("div.progressbar2").progressbar({ value: 92 });
  $("div.progressbar").each(function () {
      var element = this;
      $(element).progressbar({
          value: parseInt($(element).attr("data-last-value")),
      });
  });
});
</script>
@foreach (var item in Model)
{
   <div class="list-container">
    <div class="list-image">
        <img src="@item.ProjectLogo" width="300" height="225"/>
    </div>
    <div class="list-title">
        @Html.DisplayFor(modelItem => item.Title)
    </div>
    <div class="list-min-container">
        <div class="list-min-left">
            Owner: TBD
        </div>
        <div class="list-min-right">
            Cost: $@Html.DisplayFor(modelItem => item.EstimatedCost)
        </div>
    </div>
    <div class="list-brief">
        @Html.DisplayFor(modelItem => item.Brief)
    </div>
    <div class="list-min-container">
        <div class="list-min-left">
                        Location - TBD
        </div>
        <div class="list-min-right">
            @Html.DisplayFor(modelItem => item.EndDate)
        </div>
    </div>
    <div class="progressbar" data-last-value="@item.StartDate.Date.Month">
        <div class="progress-label">@item.StartDate.Date.Month % complete</div>
    </div>
 </div>
}

@Html.PagedListPager( (IPagedList)Model, page => Url.Action("Index", new { page }) )

However when I click on the pager to navigate to another page nothing happens, no error message or anything. Has anybody faced something similar?

EDIT :

Following is the html output from the PagedListPager:

 <div class="pagination PagedList-pager">
 <ul><li class="previous disabled PagedList-skipToPrevious"><a>&larr; Previous</a></li>
     <li class="active"><a>1</a></li>
     <li><a href="/Project?Page=1">2</a></li>
     <li class="next PagedList-skipToNext"><a href="/Project?Page=1">Next &rarr;</a></li>
 </ul></div>

解决方案

I used clientside debugging with Chrome and found that there was a javascript function that was disabling all anchors (PreventDefault). As List implements IEnumerable the datasource was fine. Now the Paging is working as expected. The code has always been fine. In case it may help anyone.

这篇关于MVC的NuGet页PagedList链接无法正常工作的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆