вторник, 7 декабря 2010, Александр Краковецкий

На недавно прошедшей конференции Microsoft SWIT я рассказывал о технологии построения data-driven сайтов под названием ASP.NET Dynamic Data. Те, кто внимательно следят за моими публикациями, должны были заметить мою слабость к этому фреймворку, который я часто использовал в своих небольших проектах. В этой статье хотел бы детально остановиться на основных принципах работы с этим фреймворком.

Содержание

• Введение в scaffolding
• Что такое ASP.NET Dynamic Data
• Архитектура ASP.NET Dynamic Data
• Первый сайт на ASP.NET Dynamic Data
• Кастомизация сайта

Введение в Scaffolding

Scaffolding - это подход к разработке приложений, работающих с базами данных, с помощью мета-программирования. Суть в том, чтобы ограничить разработчика от типичных задач - написания классов для работы с базой, а также написания CRUD операций. Впервые этот принцип был применен в Ruby on Rails, благодаря чему снискал большую популярность.

На сегодняшний день есть несколько фреймворков, которые поддерживают scaffolding, а именно: Monorail (.Net), CodeIgniter, Symfony, Yii, CakePHP, Model-Glue, Grails, Catalyst, Seam Framework, ну и наши ASP.NET Dynamic Data и ASP.NET MVC Framework's Metadata Template Helpers.

Что такое ASP.NET Dynamic Data

ASP.NET Dynamic Data – это фреймворк, который позволяет быстро разрабатывать полнофункциональные data-driven приложения, используя LINQ to SQL или Entity Framework, а также расширяет возможности элементов управления DetailsView, FormView, GridView и ListView в плане функциональности, проверки данных и отображения.

Если говорить по простому, то Dynamic Data предназначен для быстрой генерации фронт-эндов для баз данных Microsoft SQL Server.

Требования:

• Windows XP SP2/Vista/Server 2003/Server 2008/7
• Visual Studio 2008 SP1 + .NET Framework 3.5 SP1
• SQL Server 2005/2008/R2

Хронология развития ASP.NET Dynamic Data имеет такой вид:

• 9 декабря 2007 г. - вышли ASP.NET 3.5 Extensions, в которых впервые появилась возможность создания data-driven веб-приложений;
• апрель 2008 г. - ASP.NET Dynamic Data Preview  - в состав входил Dynamic Data Website Wizard, который в данный момент не поддерживается;
• 11 августа 2008 г. - вышла первая стабильная версия ASP.NET Dynamic Data, поставлялась в составе Visual Studio 2008 Service Pack 1;
• 15 мая 2009 г. - ASP.NET Dynamic Data MVC Preview, поддержка ASP.NET MVC 1.0 RTM;
• 12 апреля 2010 г. - Dynamic Data в составе Visual Studio 2010 / .NET 4. Релиз .NET 4 содержит ряд улучшений технологии Dynamic Data;
• 2010 Q2 - Feature releases  - DomainDataSource – возможность использовать Dynamic Data в качестве business layer вместо EF / Linq to SQL.

Архитектура Dynamic Data показана на рисунке ниже:

Первый сайт на ASP.NET Dynamic Data

Вначале создадим простую базу данных, которая будет состоять из трех таблиц: Blogs, Posts, Users. Структура базы показана на рисунку:

После этого открываем Visual Studio и создаем новый проект ASP.NET LINQ to SQL. Вообще есть возможность создавать два типа проекта - с использованием LINQ to SQL и с помощью LINQ to Entities. Второй вариант позволяет создавать боле сложные модели, в первом же случае нас ждут маппинг 1 к 1. Для демонстрации этого вполне хватит.

Для того, чтобы запустить работающий сайт, необходимо выполнить следующие действия:

1. Добавить Linq to SQL файл и сгенерировать модель по созданной базе данных. Например, назовем его MyBlog (в результате сгенерируется класс MyBlogDataContext)

2. Зарегистрировать в файле Global.asax DataContext:

DefaultModel.RegisterContext(typeof(MyBlogDataContext), new ContextConfiguration() { ScaffoldAllTables = true });

3. Выбрать роутинг, который будет использован (или оставить по умолчанию):

        routes.Add(new DynamicDataRoute("{table}/{action}.aspx") {
            Constraints = new RouteValueDictionary(new { action = "List|Details|Edit|Insert" }),
            Model = DefaultModel
        });

В этом случае пользователь увидит разные страницы для каждого из действий - List, Details, Edit, Insert.

Другие варианты:

        routes.Add(new DynamicDataRoute("{table}/ListDetails.aspx")
        {
            Action = PageAction.List,
            ViewName = "ListDetails",
            Model = DefaultModel
        });

        routes.Add(new DynamicDataRoute("{table}/ListDetails.aspx")
        {
            Action = PageAction.Details,
            ViewName = "ListDetails",
            Model = DefaultModel
        });

Вы можете выбирать свои варианты роутинга.

После этих несложных действий вы можете запустить приложение и увидеть его работающим.

Из коробки вам доступен функционал CRUD, проверка данных, связь данных по внешним ключам.

Рассмотрим структуру сайта:

Файл или папка	Описание
Dynamic Data	Содержит папки для пользовательских элементов управления и для страниц, отображающих данные.
Default.aspx	Страница ASP.NET, содержащая таблицы и представления, зарегистрированные в экземпляре MetaModel. Имя каждой таблицы выводится в виде элемента управления HyperLink, отображающего содержимое выбранной таблицы.
Global.asax	Содержит метод регистрации экземпляра класса MetaModel и добавления маршрутов в объект RouteCollection.
Site.css	Каскадная таблица стилей, используемая элементами управления и шаблонами страниц на платформе динамических данных.
Site.master	Главная страница узла. Шаблоны страниц Default.aspx и Dynamic Data используют главную страницу.
Web.config	Файл конфигурации узла.

Структура папки Dynamic Data:

Файл или папка	Описание
Содержимое	По умолчанию содержит папку Images и пользовательский элемент управления (GridViewPager.ascx). Папка Images содержит графические файлы, используемые в качестве значков в элементе управления страничного навигатора.
CustomPages	Папка-контейнер для пользовательских шаблонов страниц. Пользовательские шаблоны страниц используются для переопределения шаблонов страниц, определенных в папке DynamicData\PageTemplates. Например, если контекст данных содержит таблицу с именем Products, можно создать папку DynamicData\CustomPages\Products и добавить в новую папку ASPX-страницы, используемые для отображения данных из таблицы Products. Можно начать с копирования страниц из папки DynamicData\PageTemplates в папку DynamicData\CustomPages\Products с последующим изменением шаблонов.
PageTemplates	В содержимое входят шаблоны страниц, которые генерируют пользовательский интерфейс для просмотра и редактирования данных.
EntityTemplates	В содержимое входят шаблоны сущностей, которые генерируют табличный интерфейс для просмотра и редактирования данных.
FieldTemplates	В содержимое входят пользовательские элементы управления, которые генерируют пользовательский интерфейс для просмотра и редактирования полей данных.
FilterTemplates	В содержимое входят пользовательские элементы управления, которые генерируют пользовательский интерфейс для фильтрации строк данных.

Кастомизация сайта

В первую очередь нужно сказать, что Dynamic Data - это обыкновенное ASP.NET приложение, поэтому вы легко можете изменить Site.master, css файлы, добавить свои skin файлы, согласно вашим требованиям.

Разработчик может менять внешний вид всех элементов сайта:

• шаблоны полей
• шаблоны фильтров
• шаблоны страниц
• использовать свои user controls для отображения некоторого поля

Рассмотрим, как вместо textarea использовать AJAX Control Toolkit HTMLEditor.

1. Качаем Ajax Control Toolkit и добавляем ссылку на него в проект.

2. Идем FieldTemplates -> MultilineText_Edit.ascx и меняем

на

<%@ Register 
     Assembly="AjaxControlToolkit" 
     Namespace="AjaxControlToolkit.HTMLEditor" 
     TagPrefix="HTMLEditor" %> 
 
          Height="300px"  
         Width="100%" 
         AutoFocus="true" 
         Content='<%# FieldValueEditString %>'
 />

В code-behind комментируем строчку

TextBox1.MaxLength = Column.MaxLength;

и меняем TextBox1.Text на TextBox1.Content.

Запускаем - и увидим полноценный HTML редактор вместо textarea:

Для того, чтобы изменить такие свойства, как подписи к таблицам, порядок размещения элементов управления, добавить валидацию, необходимо ознакомиться с метатегами, которые используются для настройки.

Описание атрибутов для классов:

Имя атрибута	Описание
TableName	Имя таблицы, которое будет использоваться в url, в списке таблиц на главной странице, а также в качестве имени в разделе.
DisplayColumn	Первый параметр атрибута – имя колонки, которое будет использоваться по умолчанию в DropDownList в других разделах на сайте (где есть Foreign Key на текущее свойство). Второй параметр – имя колонки, по которой должна осуществляться сортировка.
ScaffoldTable	True|False – отображает или скрывает таблицу. По умолчанию равен True.

Описание атрибутов для свойств (Property):

Имя атрибута	Описание
Required	Определяет является ли свойство обязательным. Необходимо для валидации. Если равно True, при создании новой записи поле не может быть пустым.
StringLength	Определяет длину строки, которое может быть введено в текстовое поле, сгенерированное для свойства. Нужен для валидации.
Description	Определяет текст, который будет появляться при наведении курсора на элемент управления (tooltip) в режиме редактирования.
DisplayName	Имя свойства, которое будет отображаться в качестве названия колонки (header) в List Mode, а также в качестве названия редактируемого поля в Edit Mode.
DefaultValue	Значение по умолчанию, которое будет использовано во-время создания новой записи.
RegularExpression	Определяет регулярное выражение, которое будет использовано для валидации значения введенного в элемент управления в режиме редактирования.
DataType	Тип данных в который будет конвертироваться значение введенное в элемент управления.
DisplayFormat	Формат, для отображения значения свойства в Display|List|Edit режимах.
Range	Определяет минимальное и максимальное значение, которое может быть введено в элемент управления.
ScaffoldColumn	Определяет, необходимо ли показывать/скрывать свойство.
UIHint	Определяем «кастомный» элемент управления для отображения данных свойства.

Продолжение следует...

---