• home
  • Email: trainings@synapseindia.careers

Blogs

back

Understanding bulletedList Web Server Control in ASP.NET

Oct 06, 2015

The BulletedList control creates an unordered or ordered (numbered) list of items, which renders as an HTML ul or ol element, respectively. You can specify the appearance of the items and of the bullets or numbers, define the list items statically or by binding the control to data, and you can respond to users' clicks on items. The BulletedList derives from the same ListControl class as the ListBox, DropDownList, and other ASP.NET list controls, so using it is similar to working with those controls. You can define list items for the BulletedList control either by creating static items or by binding the control to a data source. If you know at design time what items you want to display, you can set the control's Items collection to a set of individual items in markup. If the items to be displayed are dynamic, you can create the item collection in code at run time.

When you define items for the BulletedList control, you define two properties: the Text property and the Value property. The Text property defines what the control displays on the page. The Value property defines a second value that is not displayed but that you might want to return when a user selects an item. For example, you might display an employee name as the text of an item, but use the employee ID as the value; when users click the item, you can read the value directly.

Exploring the Properties

A. BulletImageUrl : this property is used to set the image to be displaye as bullet , for using this property we need to set the BulletStyle property to "CustomImage"

B.BulletStyle : This property is used to define the styles of bullets like Numbered ,Disc and Circle ,CustomImage etc.

C.DisplayMode: this property defines the 3 mode in which we can specify bullets Like "Text,Hyperlink,LinkButton"

i. Text : will display static text only and can not perform any selection on it by user. ii. HyperLink : can allow selection and set the navigationurl to the "value" attribute of the ListItem defination. iii. LinkButton : it provides you the postback features on selection .

D.FirstBulletNumber : You can specify the starting bullet number in case of ordered list like numbered bullet style , alpha bullet style except disc,circle,and square which is unordered. E.g. I f u specify 3 then NumberedBullet will start with 3 and alpha and roman bullet will start by c,C,iii,III etc. E.Items : this property will add items as ListItem for the BulletedList with it's two main attributes like Text and Value . Text to be displayed and it's corersponding value to be hidden and can be retireved at run time on user's selections for the listitem in case of HyperLink and LinkButton displaymode.

F.Target: this property defines the target of the navigation url to be displayed on selecting hyperlink display mode for the control like _blank,_Parent etc.

How to: Add BulletedList Web Server Controls to a Web Forms Page

1. By using Items Property.

A.Drag the BulletedList control to the web page. B.Click on the Items Property and add the Text and Values four times. C.Select the appropriate Display Mode . D.Select the appropriate BulletStyle accordingly . E.Be careful while using DisplayMode "HyperLink" because in that case u need do define the NavigationUrl to the Value attribute of the ListItem.

2. By using Programatically at design time. <asp:BulletedList ID="blt" BulletStyle="Numbered" DisplayMode="HyperLink" runat="server" > <asp:ListItem Value="https://www.google.com">One</asp:ListItem> <asp:ListItem>Two</asp:ListItem> <asp:ListItem>Three</asp:ListItem> <asp:ListItem>Four</asp:ListItem> <asp:ListItem>Fifth</asp:ListItem> </asp:BulletedList>

3. By program at run time . protected void Button1_Click(object sender, EventArgs e) { blt.Items.Add(new ListItem("Five","https://wwww.acplm.com")); blt.Items.Add(new ListItem("Six","https://wwww.acplm.com")); blt.Items.Add(new ListItem("Seven","https://wwww.acplm.com")); blt.Items.Add(new ListItem("Eight","https://wwww.acplm.com")); blt.Items.Add(new ListItem("Nine","https://wwww.acplm.com"));

}.

4. To check at run time , that which listitem of bulletedlist is clicked . add the click event handler to the bulletedlist control and write the code

protected void BulletedList1_Click(object sender, BulletedListEventArgs e) { ListItem item = BulletedList1.Items[e.Index]; Response.Write("<script>alert('" + item.Text + "')</script>");

}

The above codes in every step is very concise to understand.In this way , you can very easily work on it.

SynapseIndia is a leading website and mobile app development company. IT Mentor & an Entrepreneur SynapseIndia's CEO Shamit Khemka spread their business across the globe. They have more than 500 full time employees and all the experts at SynapseIndia working in tandem to achieve good feedback from clients having no complaints at all. They have already delivered more than 3000 thousand projects. They pass on complete quality solutions for website development services and getting good reviews on various Web development projects.

The Employment bond is basically an agreement which the company and the employee enter into which among the other terms contained therein states that in consideration of the training given to the Employee and the money spent by the company in imparting such training, the Employee will remain in the services of the company for a particular period.

SynapseIndia (CEO: Shamit Khemka)