Главная > .NET > Вышел Telerik Extensions for ASP.NET MVC Q2 2011

Вышел Telerik Extensions for ASP.NET MVC Q2 2011

13 июля вышла новая версия Telerik Extensions for ASP.NET MVC.

Данная версия характеризуется рядом нововведений: появился новый элемент управления Chart, 3 новых скина (темы), добавилось много новых возможностей в элементе управления Grid и т.д.

Рассмотрим более подробно нововведения данной версии:

  1. Поддержка Mozilla Firefox 5. Как обычно, в Telerik Extensions for ASP.NET MVC реализована поддержка самых последних версий основных броузеров. В данном выпуске разработчики официально объявили о поддержке недавно вышедшего Mozilla Firefox 5.
  2. Обновление версии jQuery. Впервые за долгое время не была обновлена версия jQuery (по-прежнему используется версия 1.5.1). Это обстоятельство необходимо учитывать при разработке, т.к. отставание от текущей версии jQuery очень существенное – 4 версии (1.5.2, 1.6, 1.6.1 и 1.6.2).
  3. Возможность отключения скриптов jQuery validation. По умолчанию скрипты плагина jQuery validation регистрируются автоматически в ситуациях, когда они требуются для работы некоторых элементов управления (например, когда используется редактирование в Grid`е). Иногда разработчику требуется отключить автоматическую регистрацию, например, для того, чтобы вручную зарегистрировать другую версию скрипта. Это можно сделать с помощью метода jQueryValidation регистратора скриптов.

    Листинг 1.1. Отключения автоматической регистрации скриптов jQuery validation

    @(Html.Telerik().ScriptRegistrar()
        .jQueryValidation(false)
    )
    

  4. Новые скины (темы). Появилось 3 новых скина: Office 2010 Blue, Office 2010 Silver и Transparent.


    Рис. 1.1. Новые скины

  5. Новое VS-расширение Solution-wide upgrade. Теперь с помощью нового VS-расширения Solution-wide upgrade можно обновлять версию Telerik Extensions for ASP.NET MVC во всех проектах решения.
  6. Новый элемент управления Chart. Chart – это элемент управления для построения диаграмм, основанный на HTML5 (демонстрация). Все диаграммы строятся на клиенте с помощью SVG (для устаревших броузеров используется VML). Поддерживаются 3 типа диаграмм: столбчатая горизонтальная (bar), столбчатая вертикальная (column) и линейный график (line).


    Рис. 2.1. Пример столбчатой горизонтальной диаграммы


    Рис. 2.2. Пример столбчатой вертикальной диаграммы


    Рис. 2.3. Пример линейного графика

  7. Улучшен элемент управления Grid. Данная версия продукта привнесла в элемент управления Grid следующие нововведения:

    1. Client Operation Mode. Появилась новая опция клиентской привязки данных – OperationMode. Ей можно присвоить один из 2-х режимов, определенных в перечислении GridOperationMode: Server или Client. В режиме Server (режим по умолчанию) операции над данными (разбивка на страницы, сортировка, фильтрация и группировка) производятся на сервере и результат возвращается в виде порции данных в формате JSON. В режиме Client при инициализации Grid с сервера берутся сразу все данные в формате JSON и кэшируются на клиенте. В данном случае, все операции над данными производятся исключительно на клиенте (применяются к кэшированным данным). В некоторых случаях данная стратегия позволит оптимизировать производительность веб-приложения (демонстрация).

      Листинг 2.1. Включение режима Client

      @(Html.Telerik().Grid(Model)
          .Name("Orders")
          .DataBinding(dataBinding => dataBinding
              .Ajax()
                  .OperationMode(GridOperationMode.Client) // режим Client 
                  .Select("Select", "Home")
          )
          .Pageable()
          .Sortable()
      )
      

    2. Навигация с помощью клавиатуры. Теперь конечные пользователи могут перемещаться, выбирать и редактировать строки, ячейки и страницы Grid`а, используя только клавиатуру. Вдобавок Grid позволяет им использовать горячие клавиши (клавиши быстрого доступа), эта возможность также повышает доступность приложения для пользователей с ограниченными возможностями (демонстрация).

      Листинг 2.2. Включение клавиатурной навигации

      @(Html.Telerik().Grid(Model)
          .Name("Orders")
          .DataBinding(dataBinding => dataBinding
                  .Ajax()
                  .Select("Select", "Home")
          )
          .Pageable()
          .Sortable()
          .KeyboardNavigation() // включает клавиатурную навигацию
      )
      

    3. Page on Scroll. В Grid была добавлена новая возможность «Page on Scroll», реализующая кумулятивный вертикальный скроллинг (демонстрация). Эта возможность позволяет загружать по запросу дополнительные записи в Grid с помощью полосы вертикальной прокрутки (как в ленте новостей Facebook).


      Рис. 3.1. Grid c кумулятивным вертикальным скроллингом

      Листинг 2.3. Включение кумулятивного вертикального скроллинга

      @(Html.Telerik().Grid(Model)
          .Name("Grid")
          .Pageable(paging => paging.Style(GridPagerStyles.Status)
              .PageOnScroll(true)
          )
      )
      

    4. Глобальный шаблон строки. Теперь можно настроить структуру строки Grid`а благодаря глобальным шаблонам строки (клиентскому и серверному). Разработчик больше не привязан к предопределенной модели табличной строки и может самостоятельно определять внешний вид Grid`а в своем приложении (демонстрация).


      Рис. 3.2. Grid, использующий глобальный шаблон строки

      Листинг 2.4. Пример использования глобального серверного шаблона строки

      @{ 
          Html.Telerik().Grid(Model)
              .Name("Grid")
              .DataKeys(keys => keys.Add(c => c.CustomerID))
              .Columns(columns =>
              {
                  columns.Bound(c => c.CustomerID).Title("Picture");
                  columns.Bound(c => c.ContactName).Title("Name");
                  columns.Bound(c => c.CompanyName);
                  columns.Bound(c => c.Country);
                  columns.Bound(c => c.Address);
                  columns.Bound(c => c.Phone);
              })
              .RowTemplate(grid => @<text>
                  <div class="employee-details">
                      <img src='@Url.Content("~/Content/Grid/Customers/" + 
                              item.CustomerID + ".jpg")'
                          alt='@item.ContactName' />
                      <h3 class="t-widget">@item.ContactName</h3>
                      <dl>
                         <dt>Name:</dt><dd>@item.ContactName</dd>
                         <dt>Company:</dt><dd>@item.CompanyName</dd>
                         <dt>Country:</dt><dd>@item.Country</dd>
                      </dl>
                      <dl class="t-widget">
                         <dt>Address:</dt><dd>@item.Address</dd>
                         <dt>Phone:</dt><dd>@item.Phone</dd>
                      </dl>
                      <div class="commands">
                           @grid.EditButton(item)
                           @grid.DeleteButton(item)
                      </div>
                  </div>
                 </text>
              )
              .DataBinding(dataBinding => dataBinding.Server()
                  .Update("ServerRowTemplate_Update", "Grid")
                  .Delete("ServerRowTemplate_Delete", "Grid"))
              .Sortable()
              .Editable(editing => editing.Mode(GridEditMode.PopUp))
              .Scrollable(scrolling => scrolling.Height(500))
              .Pageable()
              .Render();
      }
      

Полный список изменений можно прочитать на сайте Telerik.

Реклама
Рубрики:.NET Метки: ,
  1. Комментариев нет.
  1. No trackbacks yet.

Добавить комментарий

Заполните поля или щелкните по значку, чтобы оставить свой комментарий:

Логотип WordPress.com

Для комментария используется ваша учётная запись WordPress.com. Выход / Изменить )

Фотография Twitter

Для комментария используется ваша учётная запись Twitter. Выход / Изменить )

Фотография Facebook

Для комментария используется ваша учётная запись Facebook. Выход / Изменить )

Google+ photo

Для комментария используется ваша учётная запись Google+. Выход / Изменить )

Connecting to %s

%d такие блоггеры, как: