Серверные элементы управления ASP.NET

Порядок выполнения лабораторной работы

Для работы с примерами, приводимыми в данной лабораторной работе, потребуется установка среды разработки Microsoft Visual Studio 2005+ и веб-сервера IIS 5+ (Internet Information Server).

1.Серверные элементы управления HTML.

1. Создайте новый проект по шаблону ASP.NET Web Application.
2. На странице Default.aspx добавьте в форму стандартные HTML элементы ввода данных. Это можно сделать, используя панель элементов управления, как это показано на скриншоте ниже.
   

   
   увеличить изображение
   

   Код формы должен выглядеть следующим образом:

   <form id="form1" runat="server">
     <div>
      Ваша оценка:<br><br>
     <input id="r1" type="radio" title="Отлично" value="Отлично" runat="server"/>Отлично<br />
     <input id="r2" type="radio" value="Хорошо" runat="server" />Хорошо<br />
     <input id="r3" type="radio" value="Удовлетворительно" runat="server" />Удовлетворительно<br />
     <input id="r4" type="radio" value="Неудовлетворительно" runat="server" />Неудовлетворительно<br />
     <p id="ans" runat="server"></p>
     <br>
     <input id="Submit1" type="submit" value="Отправить" OnServerClick="submit" runat="server" /><br />
    </div>
   </form>

   Обработчик события OnServerClick необходимо описать в файле Default.aspx.cs. Код метода submit:

   protected void submit(object sender, System.EventArgs e)
   {
     if (r1.Checked == true) 
       ans.InnerHtml = "Вы оценили на отлично";
     else if (r2.Checked == true)
       ans.InnerHtml = "Вы оценили на хорошо";
     else if (r3.Checked == true)
       ans.InnerHtml = "Вы оценили на удовлетворительно";
     else if (r4.Checked == true)
       ans.InnerHtml = "Вы оценили на неудовлетворительно";
     else
       ans.InnerHtml = "Вы не выбрали оценку";
   }
3. Выполните компиляцию проекта и запустите его на выполнение (либо вручную загрузите документ в браузере, указав URL соответствующего виртуального каталога).

2.Элементы управления веб-сервера.

Если для вновь созданного проекта типа ASP.NET Web Application в файле Default.aspx внутри формы (между тэгами <form> и </form> ) вставить следующий код (или сделать это перетаскиванием нужных элементов из панели инструментов, раздел "Standard" ):

<asp:ListBox id="LstBx" runat="server" width="100" height="80" AutoPostBack="True" OnSelectedIndexChanged="LBSelChanged" >
<asp:ListItem value="Sunday">Sunday</asp:ListItem>
<asp:ListItem value="Monday">Monday</asp:ListItem>
<asp:ListItem value="Tuesday">Tuesday</asp:ListItem>
<asp:ListItem value="Wednesday">Wednesday</asp:ListItem>
<asp:ListItem value="Thursday">Thursday</asp:ListItem>
<asp:ListItem value="Friday">Friday</asp:ListItem>
<asp:ListItem value="Saturday">Saturday</asp:ListItem>
</asp:ListBox>

<br/><br/>

<asp:Label id="Label1" runat="server"/>

и описать обработку событий Page_Load и OnSelectedIndexChanged в соответствующем *.aspx.cs файле:

protected void Page_Load(object sender, EventArgs e)
        {
            Label1.Text = "You selected: " + Label1.Text;
        }

        protected void LBSelChanged(object sender, System.EventArgs e)
        {
            if (LstBx.SelectedItem != null)
                Label1.Text = "You selected: " + LstBx.SelectedItem.Value;
            else
                Label1.Text = "You selected: ";
        }
    }

то при запуске проекта после выбора пользователем элемента из списка можно будет увидеть в окне браузера:

В данном примере атрибут AutoPostBack="True" указывает на необходимость немедленной обработки события на сервере.

3.Серверные элементы управления для проверки данных (валидации)

Следующий код показывает, каким образом выполняется проверка содержимого поля вода формы:

<form id="form1" runat="server">
  <asp:TextBox ID="TextBox1" runat="server" Width="123px"></asp:TextBox>
  <br />
  <asp:RegularExpressionValidator 
ID="RegularExpressionValidator1"
runat="server" 
ControlToValidate="TextBox1"   
ErrorMessage="Not valid e-mail" 
ValidationExpression="\w+([-+.']\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*" >
  </asp:RegularExpressionValidator>
</form>

В данном случае атрибут ControlToValidate указывает на то, что контролируется содержимое элемента с идентификатором TextBox1 (поля ввода текста), в случае несоответствия содержимого контролируемого поля с шаблоном, описанном в виде регулярного выражения в атрибуте ValidationExpression, выдается сообщение, указанное в атрибуте ErrorMessage.

Шаблон описывает допустимый формат адреса электронной почты. Добавьте код в проект и проверьте работу приложения.

Контрольное задание

Создайте веб-приложение ASP.NET, поддерживающее ввод на странице международного телефонного номера пользователем и использующее серверный элемент управления <asp:RegularExpressionValidator>.