Расширить HTML-сетку для добавления div в конце Html-сетки (MVC Contrib)

#c# #asp.net-mvc-4 #mvcgrid #htmlextensions

#c# #asp.net-mvc-4 #mvcgrid #htmlextensions

Вопрос:

Я искал в Интернете синтаксис или руководство по этому, но безуспешно.

Я буду признателен за любую помощь.

Я реализовал сетку в представлении, и вместо использования подкачки в виде сетки я пытаюсь реализовать кнопку «Просмотреть больше» в конце сетки, которая загружает больше данных в представление сетки.

Смотрите код

 @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 представляет количество строк на странице

Ответ №1:

После просмотра источника, я думаю, что было бы проще расширить HtmlTableGridRenderer как ScrollingHtmlTableGridRenderer и использовать

 @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 . .

Комментарии:

1. Привет, это работает! Спасибо. Не могли бы вы указать мне сообщение или ключевые работы, где я могу прочитать и узнать больше об этом? В частности, ScrollingHtmlTableGridRenderer<T> : HtmlTableGridRenderer<T> где T : класс

2. @silagy — исходный код доступен по адресу mvccontrib.codeplex.com/SourceControl/latest