分页列表:在MVC视图中以不同方式声明相同的模型?

时间:2014-07-23 15:54:03

标签: c# asp.net-mvc asp.net-mvc-5 pagedlist

我有以下小调查视图:

@model IEnumerable<PROJECT.Models.Surveys>

@if (ViewBag.canCreate)
{
    <a href="Surveys/Create" class="btn btn-success btn-sm createButton"><span class="glyphicon glyphicon-pencil"></span> Create a New Survey</a>
}
<table class="table table-striped">
    <tr>
        <th></th>
        <th>
            @Html.DisplayNameFor(model => model.Subject)
        </th>
        <th>
            @Html.DisplayNameFor(model => model.OwnerOrganization.Name)
        </th>
        <th class="hidden-xs hidden-sm">
            @Html.DisplayNameFor(model => model.CreatedDate)
        </th>
        <th class="hidden-xs hidden-sm"></th>
    </tr>

    @foreach (var item in Model)
    {
        <tr>
            <td>
                @Html.ActionLink("Details", "Details", new { id = item.Id }, htmlAttributes: new { @class = "btn-default btn-sm noDecoration" })
            </td>
            <td>
                @Html.DisplayFor(modelItem => item.Subject)
            </td>
            <td>
                @Html.DisplayFor(modelItem => item.OwnerOrganization.Name)
            </td>
            <td class="hidden-xs hidden-sm">
                @{
                    string createdDate = item.CreatedDate.Date.ToString("d");
                }
                @createdDate
            </td>

            @if ((User.Identity.IsAuthenticated) && (item.OwnerOrganizationId == ViewBag.currentUserGroupId))
            {
                <th class="hidden-xs hidden-sm">
                    @Html.ActionLink("Edit", "Edit", new { id = item.Id }, htmlAttributes: new { @class = "btn-success btn-sm noDecoration" })
                </th>
            }
        </tr>
    }

</table>

我正在尝试将“查看会员项目”中的相同分页列表功能添加到“调查”视图中:

@model PagedList.IPagedList<PROJECT.Models.MemberProjects>
@using PagedList.Mvc

....

<div class="paginationWrapper">
    <div class="leftDiv">
        @Html.PagedListPager(Model, page => Url.Action("Index", new { page = page, pageSize = ViewBag.pageSize, noSearch = true }))
    </div>
    <div class="rightDiv">

        @Html.Partial("_Pagination")

    </div>
</div>

当我尝试实现相同的功能时,我的属性被标记为表示它们不包含属性的定义,也没有接受属性PagedList.IPagedList<Project.Models.Surveys>的第一个参数的属性的扩展方法。

@model IEnumerable<PROJECT.Models.Surveys>
@model PagedList.IPagedList<PROJECT.Models.Surveys>
@using PagedList.Mvc

@if (ViewBag.canCreate)
{
    <a href="Surveys/Create" class="btn btn-success btn-sm createButton"><span class="glyphicon glyphicon-pencil"></span> Create a New Survey</a>
}
<table class="table table-striped">
    <tr>
        <th></th>
        <th>
            /* Error */
            @Html.DisplayNameFor(model => model.Subject)
        </th>
        <th>
            /* Error */
            @Html.DisplayNameFor(model => model.OwnerOrganization.Name)
        </th>
        <th class="hidden-xs hidden-sm">
            /* Error */
            @Html.DisplayNameFor(model => model.CreatedDate)
        </th>
        <th class="hidden-xs hidden-sm"></th>
    </tr>

    ....

</table>
<div class="paginationWrapper">
    <div class="leftDiv">
        @Html.PagedListPager(Model, page => Url.Action("Index", new { page = page, pageSize = ViewBag.pageSize, noSearch = true }))
    </div>
    <div class="rightDiv">

        @Html.Partial("_Pagination")

    </div>
</div>

显然这是因为我试图以两种不同的方式指定模型,但我不太清楚如何最好地解决它。有人可以提供一些建议吗?我还是MVC开发的新手。

1 个答案:

答案 0 :(得分:0)

我也有类似的问题。为此,我建议您仅在控制器中创建PagedList。您将在视图中显示调查列表。因此,不是IEnumerable<PROJECT.Models.Surveys>而是在控制器中为视图创建模型,使其支持PagedList。所以我将向您展示如何在控制器中为PagedList创建模型。现在假设你有类似的模型:

public class Survey()
{
  public string Subject{get;set;}
  public Organization org{get;set;}
  public DateTime CreatedDate{get;set;}
}

现在您正在制作此模型的IEnumerable列表。因此,而不是IEnumerable列表在控制器中执行以下操作。制作另一个模型,假设SurveyPagedListModel是这样的:

public class SurveyPagedListModel()
{
   public IPagedList<Survey> pagedListSurvey{get;set;}  
} 

现在你的观点就是这样做:

 @model SurveyPagedListModel

// Your view code goes here 

 ..................

// Place this code as per your settings where you want to set pagination

 <div class="page_numbers page_numbers-sec">
      <div class="pagination">

      @(Model.pagedListSurvey.PageCount < Model.pagedListSurvey.PageNumber ? 0 :         Model.pagedListSurvey.PageNumber)
      @(Model.pagedListSurvey.PageCount)
      @Html.PagedListPager(Model.pagedListSurvey, page => Url.Action("Index")

      </div>
 </div> 

CSS

.page_numbers 
{
    color: #333333;
    display: block;
    float: left;
    font-size: 12px;
    font-weight: bold;
    padding: 10px 0 0 15px;
}

.page_numbers-sec{
    color: #333333; 
    font-weight: normal; 
    font-size: 13px;
}

分页是Bootstrap css。只需在项目中添加bootstrap即可。