Списковые элементы управления

ASP.NET --- Основы ASP.NET --- Списковые элементы управления

Списковыми элементами управления называются специализированные веб-элементы управления, которые генерируют окна списков, раскрывающиеся списки и другие элементы управления, и могут либо привязываться к источнику данных (например, к базе данных или жестко закодированной коллекции значений), либо заполняться элементами программно. Большинство списковых элементов управления позволяет пользователю выбирать один или более элементов, но элемент управления BulletedList является исключением: он отображает статический маркированный или нумерованный список.

Все списковые элементы управления перечислены ниже:

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

Более того, класс элемента управления ListControl также определяет событие SelectedIndexChanged, запускающееся при изменении пользователем текущего выбора.

Событие SelectedIndexChanged и свойства SelectedIndex и SelectedItem к элементу управления BulletedList не используются.

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

К числу списковых элементов управления с возможностью выбора относятся DropDownList, ListBox, CheckBoxList и RadioButtonList, т.е. все списковые элементы управления кроме BulletedList. Они позволяют пользователям выбирать один или более содержащихся в них элементов. Проверить, какие элементы были выбраны, можно при обратной отправке страницы.

По умолчанию RadioButtonList и CheckBoxList визуализируются в множество переключателей и флажков, соответственно. Но оба этих класса предоставляют еще и несколько дополнительных свойств, которые позволяют управлять компоновкой таких повторяющихся элементов. Все эти свойства перечислены ниже:

Ниже показан пример страницы, объявляющей экземпляр каждого спискового элемента управления с возможностью выбора:

<div>
            <asp:ListBox runat="server" ID="Listbox1" SelectionMode="Multiple" Rows="5">
                <asp:ListItem Selected="true">Option 1</asp:ListItem>
                <asp:ListItem>Option 2</asp:ListItem>
            </asp:ListBox>
            <br />
            <br />
            <asp:DropDownList runat="server" ID="DropdownList1">
                <asp:ListItem Selected="true">Option 1</asp:ListItem>
                <asp:ListItem>Option 2</asp:ListItem>
            </asp:DropDownList>
            <br />
            <br />
            <asp:CheckBoxList runat="server" ID="CheckboxList1" RepeatColumns="3">
                <asp:ListItem Selected="true">Option 1</asp:ListItem>
                <asp:ListItem>Option 2</asp:ListItem>
            </asp:CheckBoxList>
            <br />
            <asp:RadioButtonList runat="server" ID="RadiobuttonList1"
                RepeatDirection="Horizontal" RepeatColumns="2">
                <asp:ListItem Selected="true">Option 1</asp:ListItem>
                <asp:ListItem>Option 2</asp:ListItem>
            </asp:RadioButtonList>
            <asp:Button ID="Button1" runat="server" Text="Submit" OnClick="Button1_Click" />
</div>

При первой загрузке страницы обработчик события Page.Load программно добавляет еще три элемента к каждому списковому элементу управления, как показано ниже:

protected void Page_Load(object sender, EventArgs e)
{
        if (!Page.IsPostBack)
        {
            for (int i = 3; i <= 5; i++)
            {
                Listbox1.Items.Add("Option " + i.ToString());
                DropdownList1.Items.Add("Option " + i.ToString());
                CheckboxList1.Items.Add("Option " + i.ToString());
                RadiobuttonList1.Items.Add("Option " + i.ToString());
            }
        }
}

Наконец, в результате щелчка на кнопке Submit выбранные элементы каждого списка отображаются на странице. Для элементов управления с одиночным выбором (DropDownList и RadioButtonList) потребуется получить доступ к свойству SelectedItem. Для других элементов, допускающих множественный выбор, следует циклически пройти по всем элементам коллекции Items и проверить, установлено ли свойство ListItem.Selected в true. Ниже показан код, решающий обе эти задачи:

protected void Button1_Click(object sender, System.EventArgs e)
{
        Response.Write("<b>Выбранные элементы в Listbox1:</b><br/>");
        foreach (ListItem li in Listbox1.Items)
        {
            if (li.Selected) Response.Write("- " + li.Text + "<br/>");
        }

        Response.Write("<b>Выбранный элемент в DropdownList1:</b><br/>");
        Response.Write("- " + DropdownList1.SelectedItem.Text + "<br/>");

        Response.Write("<b>Выбранные элементы в CheckboxList1:</b><br/>");
        foreach (ListItem li in CheckboxList1.Items)
        {
            if (li.Selected) Response.Write("- " + li.Text + "<br/>");
        }

        Response.Write("<b>Выбранный элемент в RadiobuttonList1:</b><br/>");
        Response.Write("- " + RadiobuttonList1.SelectedItem.Text + "<br/><br/><br/>");
}

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

Чтобы отключить какой-то элемент в списке RadioButtonList или CheckBoxList, необходимо установить его свойство ListItem.Enabled в false. Этот элемент все равно будет отображаться на странице, но в затененном и недоступном для выбора виде. В случае элементов управления ListBox и DropDownList свойство ListItem.Enabled игнорируется.

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

Элемент управления BulletedList является серверным эквивалентом элемента <ul> (неупорядоченный список) или <ol> (упорядоченный список). Как и для всех списковых элементов управления, для него с помощью свойства Items должна устанавливаться коллекция отображаемых элементов. Вдобавок для настройки способа отображения этих элементов можно использовать свойства, перечисленные ниже:

BulletStyle

Определяет тип списка. Допустимыми значениями являются Numbered (1, 2, 3), LowerAlpha (a, b, с) и UpperAlpha (А, В, С), LowerRoman (i, ii, iii) и UpperRoman (I, II, III), а также символы маркеров Disc, Circle, Square и CustomImage (в этом случае потребуется установить свойство BulletImageUrl)

BulletImageUrl

Если BulletStyle установлено в CustomImage, это свойство указывает на изображение, расположенное слева от каждого элемента и трактуемое как маркер

FirstBulletNumber

В упорядоченном списке (с использованием стилей Numbered, LowerAlpha, UpperAlpha, LowerRoman или UpperRoman) этим свойством устанавливается первое значение. Например, при установке FirstBulletNumber в 3 список может выглядеть как 3, 4, 5 (для Numbered) или С, D, Е (для UpperAlpha)

DisplayMode

Определяет, как должен визуализироваться текст каждого элемента: как текст (значение Text, принятое по умолчанию) или как гиперссылка (значение LinkButton или HyperLink). Разница между LinkButton и HyperLink состоит в способе интерпретации щелчков.

Когда используется значение LinkButton, элемент управления BulletedList генерирует событие Click, на которое можно реагировать на сервере для выполнения навигации. Когда применяется значение HyperLink, события Click элемент управления BullettedList не генерирует, вместо этого он трактует текст каждого элемента в списке как относительный или абсолютный URL-адрес, и визуализирует все элементы в виде обычных гиперссылок. Когда пользователь щелкает на каком-то из этих элементов, браузер пытается перейти по этому URL-адресу

Если свойство DisplayMode установлено в LinkButton, можно реагировать на событие Click для определения, на каком элементе был совершен щелчок. Ниже приведен пример:

<div>
            Bullet styles:<br />
            <br />
            <asp:BulletedList BulletStyle="Numbered" DisplayMode="LinkButton" ID="BulletedList1"
                OnClick="BulletedList1_Click" runat="server">
            </asp:BulletedList>
</div>

protected void Page_Load(object sender, EventArgs e)
{
        if (!Page.IsPostBack)
        {
            foreach (string style in Enum.GetNames(typeof(BulletStyle)))
            {
                BulletedList1.Items.Add(style);
            }
        }
}

protected void BulletedList1_Click(object sender, BulletedListEventArgs e)
{
        string styleName = BulletedList1.Items[e.Index].Text;
        BulletStyle style = (BulletStyle)Enum.Parse(typeof(BulletStyle), styleName);
        BulletedList1.BulletStyle = style;
}

На следующем рисунке показаны различные значения BulletStyle. Щелчок на любом из них приводит к соответствующему обновлению списка: