Bullet List in ASP.Net with Different Style and Features

In ASP.Net whenever you start design a WebForm, you may use related content or items in webform in List with bullet format. Basically BulletedList in ASP.Net is used to show your desire content in List with indicator.

You can use BulletedList as Text, Hyperlink or LinkButton mode. You can adjust List with numbers order or bullet order. So, lets understand about Bullet List in ASP.Net with different style and features.

Now, we will learn how to use this control in ASP.Net with Following Steps:

How To add Items in BulletedList in ASP.Net?

How To Change Style of BulletedList in ASP.Net?

(1) How To add Items in BulletedList in ASP.Net ?

For Adding this control, go to ToolBox and Find “BulletedList” control and select it. Then Drag it to your WebForm. After that click on “BulletedList Tasks” button. This process will present a List with containing “Choose Data Source…” and “Edit Items…”. Click on “Edit Items…” option.

Tips To Change Text In Uppercase in ASP.Net?

This will present “ListItem Collection Editor” screen. In this Screen. You can add items whatever you want.

Steps:

Go to (ToolBox) >> Select (BulletedList) >> Drag to Webform >> Click (BulletedList Tasks) >> Click (Edit Items…)

Add BulletedList with Items settings

For add items, just click on “Add” button from “ListItem Collection Editor” screen. Then select one by one item for change Text name. When you select Item, it will show you Properties in right side pane.

RDLC Report add Parameter Using ASP.Net

Go to “Text” property and change or input text name whatever you want as we mention as “Item Number A”. Like this you can add Items and change item name with following above given image steps.

When you complete this process, the source code of this control will looks like bellow.

<asp:bulletedlist height="60px" id="BulletedList1" runat="server" width="271px">
       <asp:listitem>Item Number A</asp:listitem>
       <asp:listitem>Item Number B</asp:listitem>
       <asp:listitem>Item Number C</asp:listitem> 
</asp:bulletedlist>

(2) How To Change Style of BulletedList in ASP.Net?

If you want to Change BulletedList style, you have to go to “Properties” window after selecting this control.

Change Border and color style
BackColor	#669999
BorderColor	Maroon
BorderStyle	Groove
BorderWidth	1px
ForeColor	#FFFF99

When you change this settings, it will change this controls looks different as shown bellow image.

properties settings

After complete this process. Lets start next process.

Use of CheckBoxList with Adding Items in ASP.Net.

In Next process, we will change the Bullet Style and Display Mode. When you go to Properties screen, You can choose “Display Mode” in which you can select following mode.

Display Mode

Text

HyperLink

LinkButton

In ASP, there is some bullet style you can use according to your need. There is following BulletStyle in ASP.Net.

BulletStyle
Style	Display type
Numbered	1.
LowerAlpha	a.
UpperAlpha	A.
LowerRoman	i.
UpperRoman	I.
Disc	●
Circle	◦
Square	▪
CustomImage	Inset any image

BulletStyle and DisplayMode setting

Now after apply these settings you can change the mode and style of this control.
Suppose, you want to change DisplayMode with HyperLink and want to add some Link inside every items.

Learn How to Design Master Page in Asp.Net?

Then go to Source window and apply following link add process.

Link Add Process on this control's Item.

<asp:bulletedlist ID="BulletedList1" runat="server" BackColor="#CCFFFF" BorderColor="Maroon" BorderStyle="Groove" BorderWidth="1px" BulletStyle="Square" ForeColor="#990033" Height="64px" Width="271px" DisplayMode="HyperLink">
       <asp:ListItem Value="http://google.com">Item Number A</asp:ListItem>
       <asp:ListItem Value="http://facebook.com">Item Number B</asp:ListItem>
       <asp:ListItem Value="http://twitter.com">Item Number C</asp:ListItem>
</asp:BulletedList>

Add Link in BulletedList's Items in ASP.Net

Add Link in Items

For add link, you have to pass Value inside “asp:ListItem” as shown above given instruction.

When you run application and click on particular item one by one, it will redirect you to given link. You can also link to you WebForm.

Easy way to Menu Design in ASP.Net

So, this is the way to use BulletedList in ASP.Net with easy step by step process. You can apply this process and change Bullet List in ASP.Net with Different Style and Features with SKOTechLearn.