среда, 29 декабря 2010 г.

Использование элементов управления ASP.NET в C1

Если вы создаете свои "пользовательские" элементы управления ASP.NET (ASP.NET Web User Controls), то наверняка вам интересно узнать, можно ли их использовать в C1?

Можно. И нужно.

C1 - это CMS, основанная на ASP.NET 4.0 и было бы не логично, если бы она не имела такой возможности.

Как я уже говорил, функции являются одной из важнейших концепций в С1. И именно при помощи специальной функции (LoadUserControl) вы можете вставлять свой элемент управления на страницу (и не только на страницу) сайта.


Для примера, создадим очень простой элемент управления, который будет показывать стандартный календарь:
  1. Открываем сайт в Visual Studio.
  2. Создаем в корневой папке сайта подпапку UserControls.
  3. В подпапку добавляем Web User Control из шаблонов и называем его Calendar.ascx.
  4. Добавляем в Calendar.ascx элемент управления "календарь" (asp:Calendar) и сохраняем.
(В этом месте мог бы быть ваш Web User Control.)

Теперь заходим в админку сайта и открываем страницу, чтобы добавить наш календарь:
  1. F5, чтобы запустить сайт.
  2. Заходим в админку как администратор.
  3. В разделе "Контент" (Content) выбираем страницу и открываем ее на редактирование.
  4. На вкладке "Контент" (Content) страницы переключаемся из визуального редактора в редактор кода (Source).
Как я уже и говорил, элемент управления ASP.NET добавляется в С1 при помощи специальной функции:
  1. На открытой в редакторе кода странице, ставим курсор туда, куда мы хотим вставить наш календарь.
  2. Вызываем меню Insert и выбираем пункт Function Markup.
  3. В окне выбора функции раскрываем последовательно All Functions | Composite | AspNet и выбираем функцию LoadUserControl.
  4. В окне свойств функции (Function Properties) выбираем единственный обязательный (красненький, значит) параметр Path, и указываем путь к нашему файлу ascx с календарем. Путь к самому веб-сайту заменяем тильдой ("~") и дальше пишем относительный путь. В нашем примере, путь будет такой: ~/UserControls/Calendar.ascx
  5. Сохраняем изменения на странице (Save).
  6. B делаем предварительный просмотр (вкладка Preview).
Важно! Если вместо страницы с вашим календарем у вас возникнет ошибка, вам нужно будет "обернуть" добавленную функцию тегами <asp:form></asp:form> вот так:

<asp:form xmlns:asp="http://www.composite.net/ns/asp.net/controls">
  <!-- код функции -->
</asp:form>

Для нашего календаря - это понадобится.

Если понравилось, можно опубликовать страницу (Publish) и смотреть в любимом браузере.

Важно! Если вы пытаетесь проделать это же в Internet Explorer'е, у вас не получиться вставить функцию через меню Insert | Function Markup в редакторе кода. Однако можно вставить код функции непосредственно на страницу. Для нашего примера, просто скопируйте и вставьте этот код (и сразу asp:form) :

<asp:form xmlns:asp="http://www.composite.net/ns/asp.net/controls">
  <f:function name="Composite.AspNet.LoadUserControl" xmlns:f="http://www.composite.net/ns/function/1.0">
    <f:param name="Path" value="~/UserControls/Calendar.ascx" />
  </f:function>
</asp:form>

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

Отправить комментарий