Принципы разработки пользовательского интерфейса интернет-приложения

В результате введенные в текстовое поле элементы после нажатия на кнопку "Добавить" добавляются не только в таблицу, но и в списки, как показано на рис. 5.25.

Рис. 5.25. Результат динамического добавления элементов к спискам ListBox и DropDownList

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

В качестве примера добавим два элемента Label на страницу. Свойства ID элементов установим равными lbl_ListBoxSelectedItem и lbl_DropDownListSelectedItem. Добавим также кнопку ID=btn_ShowSelectedItems, как показано на рис. 5.26.

Рис. 5.26. Добавление новых элементов на страницу в режиме дизайна

При нажатии на кнопку "Отобразить выбранные элементы" в элементах lbl_ListBoxSelectedItem и lbl_DropDownListSelectedItem должны отобразиться выбранные в данный момент элементы.

Добавим обработчик события нажатия на кнопку "Отобразить выбранные элементы". Исходный код процедуры представлен ниже.

protected void btn_ShowSelectedItems_Click(object sender,
EventArgs e)
{
  if (lb_goods.SelectedItem != null)
    lbl_ListBoxSelectedItem.Text = "В элементе ListBox выбран
     элемент " + lb_goods.SelectedItem.Text;
  else
    lbl_ListBoxSelectedItem.Text = "В элементе ListBox ничего
     не выбрано";

  if (ddl_goods.SelectedItem!=null)
    lbl_DropDownListSelectedItem.Text = "В элементе DropDownList
     выбран элемент " + ddl_goods.SelectedItem.Text;
  else
    lbl_DropDownListSelectedItem.Text = "В элементе
     DropDownList ничего не выбрано";
}

Как видно, обращение к текущему элементу списков происходит посредством свойства SelectedItem, предоставляющего доступ к объекту - элементу списка. Если необходимо получить доступ к свойству Text текущего элемента списка, к нему возможно обратиться следующим образом: ddlgoods.SelectedItem.Text.

Результаты работы данной страницы представлены на рис. 5.27.

Рис. 5.27. Результат выполнения кода отображения текущего элемента списка

В реальных приложениях часто возникает необходимость привязки значений элемента управления к какому-либо источнику данных. Таким источником могут быть таблицы базы данных, массивы, свойства объектов или выражения, объединяющие несколько элементов. Рассмотрим привязку значений элемента управления DropDownList к данным, хранящимся в строковом массиве. Привязки элементов управления к другим источникам данных более подробно рассматриваются в "Использование баз данных в приложениях ASP.NET" "Использование баз данных в приложениях ASP.NET".

Для привязки элемента управления DropDownList к данным, хранящимся в строковом массиве, сначала необходимо создать сам массив, а также вызвать метод DataBind(), который осуществит привязку элемента управления к источнику данных. При вызове метода DataBind() для всей страницы будет осуществлена привязка всех элементов управления, расположенных на странице, к источникам данных. Метод DataBind() проверяет все выражения на странице и заменяет их соответствующими значениями, взятыми из указанного источника данных. Если не вызвать этот метод, выражение привязки не заполнит элемент управления - он просто будет отброшен в момент преобразования страницы в HTML.

public string[] listData ={"доска","кирпич","бетон","песок"};
protected void Page_Load(object sender, EventArgs e)
{
  Page.DataBind();
}

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

<asp:DropDownList ID="ddl_goods" runat="server"
DataSource='<%#listData %>' Width="185px">
<asp:ListItem>порошок стиральный</asp:ListItem>
<asp:ListItem>отбеливатель</asp:ListItem>
</asp:DropDownList>

Здесь было использовано выражение привязки данных, которое располагается между ограничителями <%# %>. В качестве выражения привязки данных не допускается использование программного кода, это может быть значение свойства, переменная-член или функция либо любое другое выражение, которое может быть вычислено во время выполнения.

В данном случае, в качестве выражения привязки данных указана переменная listData, являющаяся именем созданного ранее массива строк. Теперь в момент запуска приложения элемент DropDownList будет заполнен значениями элементов массива.

ASP.NET предоставляет много других полезных элементов управления, реализующих самые различные задачи. Рассмотрим самые основные из них, использование которых необходимо практически в каждом Web-приложении. Остальные будут рассматриваться в следующих частях данного курса.