0

我已经在网上搜索以找到语法或指南，但没有成功。

我将不胜感激。

我已经在视图中实现了一个网格，而不是使用网格视图的分页，我试图在网格的末尾实现一个按钮“查看更多”，它将更多数据加载到网格视图中。

查看代码

@Html.Grid(Model.Orders).Columns(columns =>
        {
            columns.For(c => @Html.AddInstitudeRetangle(c.User.Institute.InstitudeColor, c.User.Institute.InstituteName)).Named("");
            columns.For(c => @Html.CheckBox(c.OrderID.ToString(), false, new { @ID = "cb-" + c.OrderID.ToString(), @Name = "cb-" + c.OrderID.ToString() })).Header("<th><input type=\"checkbox\" id=\"chkHeader\" /></th>");
            columns.For(c => @Ajax.LinkForBootstrapModalNo("OrderDetails", "OrdersManagement", c.OrderID.ToString(), new { OrderID = c.OrderID }, new { id = "OrderID" }).LoadingPanel("Please Wait Loading...").ToMVCHtmlString()).Named(OrdersManagementStrings.OrderID);
            columns.For(c => @Html.GetOrderTypeIcon(c.OrderTypeStatus, c.OrderTypeStatus.GetDescription())).Named(OrdersManagementStrings.OrderType);
            columns.For(c => String.Format("{0:dd/MM/yyyy hh:mm}", c.CreationDate)).Named(OrdersManagementStrings.OrderDate);
            columns.For(c => String.Format("{0} {1}", c.User.FirstName, c.User.LastName)).Named(OrdersManagementStrings.CustomerName);
            columns.For(c => c.User.Institute.InstituteName).Named(OrdersManagementStrings.AffiliateName);
            columns.For(c => c.TotalCost).Named(OrdersManagementStrings.TotalCost);
            columns.For(c => c.ShippingTypeEnum.GetDescription()).Named(OrdersManagementStrings.ShippingType);
            columns.For(c => c.Address.FullAddress).Named(OrdersManagementStrings.Address);
            columns.For(c => c.OrderStatusEnum.GetDescription()).Named(OrdersManagementStrings.OrderStatus);
        }).Attributes(@class => "table table-hover table-responsive table-condensed", @id => "ordersTable")

        <div id="scroll" data-itemsperpage="50" data-spy="scroll">Load More</div

现在，当用户最后单击 div 时，我正在使用 ajax 请求加载更多数据。

现在，我想创建一个扩展，将这个 div 添加到网格的末尾。

所以最后的语法将是

columns.For(c => c.OrderStatusEnum.GetDescription())
.Named(OrdersManagementStrings.OrderStatus);
            })
.Attributes(@class => "table table-hover table-responsive table-condensed", @id => "ordersTable")
.LoadMoreButton(50);

数字 50 代表每页的行数

4

1 回答 1

1

HtmlTableGridRenderer在查看源代码后，我认为扩展为 aScrollingHtmlTableGridRenderer和使用可能更容易

@Html.Grid(Model.Orders)
     .RenderUsing(new ScrollingHtmlTableGridRenderer(50))
     ...

然后在ScrollingHtmlTableGridRenderer覆盖RenderGridEnd中添加额外的 DIV

public class ScrollingHtmlTableGridRenderer<T> : HtmlTableGridRenderer<T>
    where T : class
{
     private readonly int _itemsPerPage;

     public ScrollingHtmlTableGridRenderer(int itemsPerPage)
     {
          _itemsPerPage = itemsPerPage;
     }

     protected override void RenderGridEnd()
     {
          base.RenderGridEnd();
          RenderText("<div id=\"scroll\" data-itemsperpage=\"" + _itemsPerPage + \"" data-spy=\"scroll\">Load More</div>");
     }
}

您可能可以将其作为扩展来执行，它基本上创建一个新的渲染器并将所有数据从底层网格模型传播到它，但是Grid该类似乎是通过将渲染器替换为处理您的自定义需求的渲染器来构建的而不是通过扩展IGridOptionsModel.

于 2014-06-29T03:50:56.223 回答