Основы Asp.Net – Часть 5

В данной статье рассмотрим вопросы отладки и трассировки приложений ASP.NET, а также основы создания элементов управления WebForm.

Отладка и трассировка приложений ASP.NET

Если вам приходилось работать с Visual InterDev, то вы, наверное, помните, что отлаживать приложения в нем было не очень удобно. ASP.NET выигрывает и в этом отношении: при создании проектов ASP.NET мы можем использовать те же самые средства отладки, что и для любых других проектов Visual Studio.NET. Например, мы можем устанавливать брейкпойнты в скриптовых блоках (или в файлах С#), запускать сеансы отладки, производить пошаговое выполнение и т. п.

Кроме того, мы можем осуществлять трассировку файлов *.aspx просто путем

добавления атрибута trace в открывающий скриптовый блок:

<%@ Page Language="c#" Codebehind="WebForml.aspx.cs"

AutoEventWireup="False" Inherits="FirstWebApplication.WebForml" trace="true"

В результате в конец возвращаемого клиенту файла HTML будет добавлена информация трассировки (рис. 10).

Мы можем добавлять и свои собственные данные трассировки. Для этого используется класс Trace. Каждый раз, когда нам нужно добавить свое собственное сообщение трассировки, мы просто используем метод Write этого класса:

<%

Trace:Write("App Ctegory", "About to determine agent...");

HttpRequest r;

r = this.Request;

HttpResponse rs;

rs = this.Response;

rs.Write(r.ServerVariable[“HTTP_USER_AGENT”]);

%>

Рис. 10. Получение информации трассировки

Мы уже достаточно много узнали про запросы НТТР и создание кода HTML в от­вет на эти запросы. Однако мы еще ничего не сказали про элементы графического интерфейса, которые можно использовать как для приема данных от пользователя, так и для возврата ему информации в ответ на его запрос, хотя здесь ASP.NET предлага­ет нам еще большее количество новых и очень привлекательных возможностей.

Элементы управления WebForm

Одно из важнейших достоинств ASP.NET заключается в том, что при его исполь­зовании резко упрощается создание элементов пользовательского интерфейса на web-страницах. Элементы управления WebForm (их также называют серверными элементами управления (server controls) или элементами управления Web (Web controls)) определены в пространстве имен System.Web.UI.WebControls. Их основное назначение - избавить нас от трудоемкой работы по созданию элементов управ­ления HTML на web-странице вручную.

Вот пример. Если мы создаем классическую страницу ASP и у нас есть необхо­димость разместить на ней несколько текстовых полей, то нам придется писать теги для каждого текстового поля на странице вручную. В ASP.NET нам достаточ­но будет перетащить на шаблон времени разработки графические элементы уп­равления из Toolbox, а затем их настроить. Например, для текстового поля будет автоматически сгенерирован следующий код:

<form method="post" runat="server">

<asp:TextBox id=TextBox1 style="Z-INDЕХ: 101; LEFТ: 27рх: POSIТION: absolute;

TUP: 30px" runat="server">

</asp:TextBox>

</form>

Когда придет время отвечать на запрос пользователя, среда выполнения ASP.NET автоматически преобразует этот код в тег HTML следующего вида:

<input name="textBox1" type="text" id="TextBox1" style="Z-INDЕХ: 101; LEFT: 27рх;

POSITION: absolute; ТОР: 30px" />

Еще одно преимущество элементов управления WebForm заключается в том, что с ними очень удобно работать с программной точки зрения: каждому из этих эле­ментов управления соответствует класс в библиотеке базовых классов .NET, и мы можем работать с ними, как с любыми другими классами , и в файле *.aspx, и в производном от Page классе С#. Кроме того, в любом элементе управления WebForm так­же определен набор событий, которые будут обрабатываться на сервере (более под­робно об этом будет рассказано чуть ниже).

И последнее, о чем тоже стоит упомянуть. При использовании элементов управления WebForm в нашем распоряжении появляется целый набор возможностей для проверки ввода данных пользователем. Таким образом, мы избавляемся не только от необходимости вручную писать теги для элементов управления HTML, но и от ручного создания клиентских скриптов JavaScript для проверки вводимых данных. (Конечно, если нам все же нужно использовать код JavaScript на нашей странице, никто нам этого делать не запрещает.)

Создание элементов управления WebForm

При создании проекта на основе шаблона Web AppLication в нашем распоряжении всегда есть набор элементов управления WebForm. Для того чтобы ими воспользо­ваться, достаточно перейти на соответствующую вкладку в Toolbox.

Настройку параметров каждого из элементов управления WebForm можно про­изводить при помощи обычного окна свойств в IDE Visual Studio.NET. Эти эле­менты управления очень похожи на элементы управления Windows Forms, и поэто­му проблем с настройкой подавляющего большинства свойств у нас не будет.

При внесении изменений через окно свойств для элемента управления все измене­ния сразу же записываются напрямую в файл *.aspx. Например, если для тек­стового поля txtEMail мы изменим значения свойств BorderStylе, BorderWidth, BackColоr, BorderColor и ToolТip, в теге <asp:textbox> появятся новые пары имя-значение:

<asp:textbox id=txtEMail runat="server" BorderStyle="Ridge" BorderWidth="5px" BackColor="PaleGreen" BorderColor="DarkOliveGreen" ToolTip="Еntеr your e-mail here...">

</asp:TextBox>

А вот как выглядит итоговый результат в виде кода HTML, который вернется пользователю:

<input name="txtEMail" type ="text" value="fdfdf" id="txtEMail" title="Enter your e-mail here..." stуlе="background-color:PaleGreen; border-color:DarkOliveGreen; border-width:5px; border-style:Ridge;" />

Давайте разберемся с синтаксисом записей для элементов управления WebForm в файле *.aspx. Для каждого элемента управления используется синтаксис, очень напоминающий формат XML. Открывающим тегом всегда будет <asp: тип_элемента_управления runat=" server">, а закрывающим - </asp: тип-элемента-управления>.

Вот два примера таких тегов: .

<asp:TextBox id=TextBox1 style="Z-INDЕХ: 101; LEFТ: 27рх; POSIТION: absolute; ТОР: 30рх" runat="server">

</asp:TextBox>

<asp:Button id=Button1 style="Z-INDЕХ: 102; LEFТ: 26рх; POSIТION: absolute; ТОР: 66рх" runat="server" DESIGNТIMEDRAGDROP="21" Text="Button">

</asp : Button>

Атрибут runat="server" означает, что это - элемент управления WebForm, предназначенный для выполнения на сервере. Прежде чем его код отправится к клиен­ту, он будет преобразован средой выполнения ASP.NET в привычный код HTML.

В файле С#, который указан в атрибуте Codebehind, код также изменился. В нем появились новые объекты, представляющие элементы управления. Имена этих объектов совпадают с идентификаторами элементов в тегах файла *.aspx:

public class WebForm1 : System.Web.UI.Page

{

protected System.Web.UI.WebControls.Button btnSubmit;

protected System.Web.UI.WebControls.CheckBox ckBoxNewsLetter;

protected System.Web.UI.WebControls.TextBox txtEMail;

protected System.Web.UI.WebControls.TextBox txtLNaтe;

protected System.Web.UI.WebControls.TextBox txtFNaтe:

…

}

Конечно же, мы можем программным образом работать с этими объектами при­вычными способами С#.

Иерархия классов элементов управления WebForm

Все элементы управления WebForm - это классы, производные от базового класса System.Web.UI.WebControls.WebControl. Для этого класса, в свою очередь, базовым яв­ляется System.Web.UI.WebControls.Control, а тот уже происходит непосредственно от System.Object. Например, иерархия классов для элемента управления Button вы­глядит так, как показано на рис. 11.

Рис. 11. Иерархия классов для элемента управления Button

И класс Control, и класс WebControl наделяют производные классы каждый сво­им набором очень важных членов. Свойства, определенные в классе Control, пред­ставлены в табл. 10.

Таблица 10. Свойства базового класса Control

Свойство Описание

ID Позволяет получить или установить идентификатор элемента управления

MaintainState Позволяет работать с состоянием просмотра для элемента управления

Page Возвращает объект Page, то есть страницу, на которой находится данный элемент управления

Visible Позволяет получить или определить видимость элемента управления (то есть будет он выводиться на странице или нет)

Свойства, определенные в классе WebContro1, в основном позволяют определять внешний вид элемента управления (табл. 11).

Таблица 11. Свойства базового класса WebControl

Свойство Описание

BackColor Позволяет получить или установить цвет фона элемента управления

BorderColor Позволяет получить или установить цвет рамки вокруг элемента управления

BorderStyle Позволяет получить или установить стиль рамки вокруг элемента управления

BorderWidth Позволяет получить или установить толщину рамки вокруг элемента управления

Enable Позволяет получить или установить значение, определяющее доступность элемента управления

Font Позволяет получить информацию об используемом шрифте

ForeColor Позволяет получить или установить цвет переднего плана (обычно это – цвет надписи) для элемента управления

Height Width Определяет высоту и ширину элемента управления

TabIndex Позволяет получить или установить значение TabIndex (очередности перехода по клавише Tab)

ToolTip Позволяет получить или установить значение ToolТip - всплывающей подсказки, появляющейся при наведении на элемент управления указателя мыши

Обработка событий элементов управления WebForm

События, генерируемые элементами управления WebForm, можно перехватывать и обрабатывать двумя способами. Первый способ - делать все непосредственно в браузере клиента при помощи клиентских браузерных скриптов JavaScript. Это традиционный подход, который наиболее удобен в тех ситуациях, когда нужно выполнять форматирование на web-странице, выводить оповещения в окне брау­зера или осуществлять прочие взаимодействия с объектной моделью, реализован­ной в браузерах. Но элементы управления WebForm предлагают нам и другой спо­соб - обрабатывать и перехватывать их события на сервере. Для этого достаточно добавить обработчик события при помощи окна Property свойств элемента управ­ления. Обычно такой способ наиболее удобен для выполнения операций, не свя­занных с графическим интерфейсом - например, для производства каких-то вы­числений, редактирования таблицы с данными и т. п.

Давайте рассмотрим применение обработки событий элементов управления WebForm на сервере. В качестве элемента управления у нас будет использован Calen­dar, а реагировать мы будем на событие Se1ectionChanged. Выглядеть это может так:

protected void Calendarl_SelectionChanged (object sender. System.EventArgs е)

{

Response.Write("<h5>Your саг wil1 bе delivered оn:" + Calendarl:Selecteddate.date +"</h5>") ;

}

Теперь при выборе пользователем даты в календаре сработает событие SelectionChanged и в окне браузера появится надпись, например:

Your car will be delivered on:2001-02-12T00:00:00

Конечно, мы можем использовать для подобных целей и клиентские браузер­ные скрипты - никто этого нам не запрещает. Все зависит от ситуации - свои до­стоинства есть у каждого способа. Клиентским скриптам не нужно обращаться на сервер, поэтому они будут работать гораздо быстрее. С другой стороны, серверные скрипты проще и надежнее.