Introduction & Demonstration
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 given below uses
the BulletedList control to render an unordered list of products.
![BulletListContol1.gif]()
<%@ Page Language="VB" AutoEventWireup="false" CodeFile="1_Without_Image.aspx.vb"Inherits="_Default" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD
XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script runat="server">
</script>
<html xmlns="http://www.w3.org/1999/xhtml" >
<head id="Head1" runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:BulletedList
id="blProducts"
DataSourceID="SqlDataSource1"
DataTextField="Title"
Runat="server" />
<asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$
ConnectionStrings:DatabaseConnectionString1 %>"
ProviderName="<%$
ConnectionStrings:DatabaseConnectionString1.ProviderName %>"
SelectCommand="SELECT
[ID], [TITLE] FROM [PRO_LIST]"></asp:SqlDataSource>
</div>
</form>
</body>
</html>
We can control the appearance of the bullets that appear for each list item with
the BulletStyle property. This property accepts the following values:
We 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, then we can
associate an image with each list item. For example, the page given below
displays an image named Bullet_List.gif with each list item.
![BulletListContol2.gif]()
<%@ Page Language="VB" AutoEventWireup="false" CodeFile="1_Without_Image.aspx.vb"Inherits="_Default" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD
XHTML 1.0
Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script runat="server">
</script>
<html xmlns="http://www.w3.org/1999/xhtml" >
<head id="Head1" runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:BulletedList
id="blProducts"
DataSourceID="SqlDataSource1"
DataTextField="Title"
BulletStyle="customimage"
BulletImageUrl="~/Bullet_List.gif"
Runat="server" />
<asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$
ConnectionStrings:DatabaseConnectionString1 %>"
ProviderName="<%$
ConnectionStrings:DatabaseConnectionString1.ProviderName %>"
SelectCommand="SELECT
[ID], [TITLE] FROM [PRO_LIST]"></asp:SqlDataSource>
</div>
</form>
</body>
</html>
We 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 is rendered as a link to another page.
- LinkButton: Each list item is rendered by a LinkButton control.
- Text: Each list item is rendered as plain text.
For example, the page
given below displays a list of links to other websites.
![BulletListContol3.gif]()
<%@ Page Language="VB" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD
XHTML 1.0
Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script runat="server">
</script>
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>Untitled
Page</title>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:BulletedList
id="blHyperLinkWebsites"
DisplayMode="HyperLink"
Target="_blank"
Runat="server">
<asp:ListItem
Text="Itorian"
Value="http://www.itorian.com" />
<asp:ListItem
Text="C#
Corner"
Value="http://www.c-sharpcorner.com" />
<asp:ListItem
Text="VB.Net
Haven"
Value="http://www.vbdotnethaven.com" />
</asp:BulletedList>
</div>
</form>
</body>
</html>
Each list item has both its Text and Value properties set. The Text property
contains the text that is displayed for the list item, and the Value property
contains the URL for the other website. Notice that the Target property is set
to the value _blank. When we click one of the hyperlinks, the page is opened in
a new window. The BulletedList control is different from the other List controls
because it does not support the SelectedIndex, SelectedItem, and SelectedValue
properties.
HAVE A GREAT CODING!