ASP.NET 4 Unleased - p 50 ppt
Bạn đang xem bản rút gọn của tài liệu. Xem và tải ngay bản đầy đủ của tài liệu tại đây (590.79 KB, 10 trang )
ptg
464
CHAPTER 10 Using List Controls
LISTING 10.11 ShowListBox.aspx
<%@ Page Language=”C#” %>
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.1//EN”
“
<script runat=”server”>
protected void btnSubmit_Click(object sender, EventArgs e)
{
lblMovie.Text = lstMovies.SelectedItem.Text;
}
</script>
<html xmlns=” >
<head id=”Head1” runat=”server”>
<title>Show ListBox</title>
</head>
<body>
<form id=”form1” runat=”server”>
<div>
<asp:ListBox
id=”lstMovies”
DataSourceID=”srcMovies”
DataTextField=”Title”
DataValueField=”Id”
Rows=”8”
Runat=”server” />
<p>
<asp:Button
id=”btnSubmit”
Text=”Submit”
OnClick=”btnSubmit_Click”
Runat=”server” />
</p>
<hr />
<asp:Label
id=”lblMovie”
Runat=”server” />
<asp:SqlDataSource
id=”srcMovies”
From the Library of Wow! eBook
ptg
465
Working with the ListBox Control
10
SelectCommand=”SELECT Id, Title FROM Movies”
ConnectionString=”<%$ ConnectionStrings:Movies %>”
Runat=”server” />
</div>
</form>
</body>
</html>
The ListBox control in Listing 10.11 includes a Rows property. The Rows property deter-
mines the number of list items that the ListBox displays.
You can also configure the ListBox control to enable a user to select multiple items. This
is illustrated in the page in Listing 10.12 (see Figure 10.11).
FIGURE 10.11 Selecting multiple list items.
LISTING 10.12 ShowMultipleListBox.aspx
<%@ Page Language=”C#” %>
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.1//EN”
“
<script runat=”server”>
From the Library of Wow! eBook
ptg
466
CHAPTER 10 Using List Controls
protected void btnSubmit_Click(object sender, EventArgs e)
{
foreach (ListItem item in lstMovies.Items)
if (item.Selected)
lblMovie.Text += “<li>” + item.Text;
}
</script>
<html xmlns=” >
<head id=”Head1” runat=”server”>
<title>Show Multiple ListBox</title>
</head>
<body>
<form id=”form1” runat=”server”>
<div>
<asp:ListBox
id=”lstMovies”
DataSourceID=”srcMovies”
DataTextField=”Title”
DataValueField=”Id”
SelectionMode=”Multiple”
Runat=”server” />
<p>
<asp:Button
id=”btnSubmit”
Text=”Submit”
OnClick=”btnSubmit_Click”
Runat=”server” />
</p>
<hr />
<asp:Label
id=”lblMovie”
EnableViewState=”false”
Runat=”server” />
<asp:SqlDataSource
id=”srcMovies”
SelectCommand=”SELECT Id, Title FROM Movies”
From the Library of Wow! eBook
ptg
467
Working with the CheckBoxList Control
10
ConnectionString=”<%$ ConnectionStrings:Movies %>”
Runat=”server” />
</div>
</form>
</body>
</html>
The ListBox in Listing 10.12 includes a SelectionMode property that is set to the value
Multiple. A user can select multiple items from the ListBox by using the Ctrl or Shift key
when clicking more than one list item.
WARNING
Most users don’t understand how to select multiple items from a ListBox control. If
you want to allow users to pick multiple items, a better approach is to use either the
CheckBoxList control (discussed in the next section) or the MultiSelectList control
(discussed in the final section).
When you click the Submit button in Listing 10.12, all the selected list items display in a
Label control. The SelectedItem, SelectedIndex, and SelectedValue properties return
only the first list item selected. When multiple items are selected, you need to iterate
through the Items collection of the ListBox control to detect the selected items.
Working with the CheckBoxList Control
The CheckBoxList control renders a list of check boxes, which can be rendered horizon-
tally or vertically. Unlike the other List controls, a user always can select multiple items
when using a CheckBoxList control.
For example, the page in Listing 10.13 contains a CheckBoxList control that renders its list
items in two columns (see Figure 10.12).
From the Library of Wow! eBook
ptg
468
CHAPTER 10 Using List Controls
LISTING 10.13 ShowCheckBoxList.aspx
<%@ Page Language=”C#” %>
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.1//EN”
“
<script runat=”server”>
protected void btnSubmit_Click(object sender, EventArgs e)
{
foreach (ListItem item in cblMovies.Items)
if (item.Selected)
lblMovie.Text += “<li>” + item.Text;
}
</script>
<html xmlns=” >
<head id=”Head1” runat=”server”>
<title>Show CheckBoxList</title>
</head>
<body>
<form id=”form1” runat=”server”>
<div>
FIGURE 10.12 Displaying list items with the CheckBoxList control.
From the Library of Wow! eBook
ptg
469
Working with the CheckBoxList Control
10
<asp:CheckBoxList
id=”cblMovies”
DataSourceID=”srcMovies”
DataTextField=”Title”
DataValueField=”Id”
RepeatColumns=”2”
Runat=”server” />
<p>
<asp:Button
id=”btnSubmit”
Text=”Submit”
OnClick=”btnSubmit_Click”
Runat=”server” />
</p>
<hr />
<asp:Label
id=”lblMovie”
EnableViewState=”false”
Runat=”server” />
<asp:SqlDataSource
id=”srcMovies”
SelectCommand=”SELECT Id, Title FROM Movies”
ConnectionString=”<%$ ConnectionStrings:Movies %>”
Runat=”server” />
</div>
</form>
</body>
</html>
When you click the Submit button, the values of the Text property of any selected check
boxes display in a Label control. The selected check boxes are retrieved from the
CheckBoxList control’s Items property.
The CheckBoxList control includes three properties that affect its layout:
. RepeatColumns—The number of columns of check boxes to display.
. RepeatDirection—The direction in which the check boxes are rendered. Possible
values are Horizontal and Vertical.
. RepeatLayout—Determines whether the check boxes display in an HTML table.
Possible values are Table and Flow.
From the Library of Wow! eBook
ptg
470
CHAPTER 10 Using List Controls
Normally, a CheckBoxList control renders its list items in an HTML table. When the
RepeatLayout property is set to the value Flow, the items are not rendered in a table.
Working with the BulletedList Control
The BulletedList control renders either an unordered (bulleted) or ordered (numbered)
list. Each list item can be rendered as plain text, a LinkButton control, or a link to another
web page.
For example, the page in Listing 10.14 uses the BulletedList control to render an
unordered list of movies (see Figure 10.13).
FIGURE 10.13 Displaying a list items with the BulletedList control.
LISTING 10.14 ShowBulletedList.aspx
<%@ Page Language=”C#” %>
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.1//EN”
“
<html xmlns=” >
<head id=”Head1” runat=”server”>
<title>Show BulletedList</title>
</head>
From the Library of Wow! eBook
ptg
471
Working with the BulletedList Control
10
<body>
<form id=”form1” runat=”server”>
<div>
<asp:BulletedList
id=”blMovies”
DataSourceID=”srcMovies”
DataTextField=”Title”
Runat=”server” />
<asp:SqlDataSource
id=”srcMovies”
SelectCommand=”SELECT Title FROM Movies”
ConnectionString=”<%$ ConnectionStrings:Movies %>”
Runat=”server” />
</div>
</form>
</body>
</html>
You can control the appearance of the bullets that appear for each list item with the
BulletStyle property. This property accepts the following values:
. Circle
. CustomImage
. Disc
. LowerAlpha
. LowerRoman
. NotSet
. Numbered
. Square
. UpperAlpha
. UpperRoman
You can set BulletStyle to Numbered to display a numbered list. If you set this property
to the value CustomImage and assign an image path to the BulletImageUrl property, you
can associate an image with each list item. For example, the page in Listing 10.15
displays an image named Bullet.gif with each list item (see Figure 10.14).
From the Library of Wow! eBook
ptg
472
CHAPTER 10 Using List Controls
LISTING 10.15 ShowBulletedListImage.aspx
<%@ Page Language=”C#” %>
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.1//EN”
“
<html xmlns=” >
<head id=”Head1” runat=”server”>
<title>Show BulletedList Image</title>
</head>
<body>
<form id=”form1” runat=”server”>
<div>
<asp:BulletedList
id=”blMovies”
DataSourceID=”srcMovies”
DataTextField=”Title”
BulletStyle=”CustomImage”
BulletImageUrl=”~/Images/Bullet.gif”
Runat=”server” />
FIGURE 10.14 Displaying image bullets.
From the Library of Wow! eBook
ptg
473
Working with the BulletedList Control
10
<asp:SqlDataSource
id=”srcMovies”
SelectCommand=”SELECT Title FROM Movies”
ConnectionString=”<%$ ConnectionStrings:Movies %>”
Runat=”server” />
</div>
</form>
</body>
</html>
You can modify the appearance of each list item by modifying the value of the
DisplayMode property. This property accepts one of the following values from the
BulletedListDisplayMode enumeration:
. HyperLink—Each list item renders as a link to another page.
. LinkButton—Each list item renders by a LinkButton control.
. Text—Each list item renders as plain text.
For example, the page in Listing 10.16 displays a list of links to other websites (see
Figure 10.15).
FIGURE 10.15 Displaying list items as hyperlinks.
From the Library of Wow! eBook
