Category Archives: ASP.NET

There are several list controls available to ASP.NET. They are the DropDownList, ListBox, CheckBoxList, RadioButtonList and BulletedList controls. The one I will go over in this post is the BulletedList control.

The ASP.NET BulletedList control is used to create a defined list of items formated with bullets. Each item in a BulletedList control is considered a ListItem element. This control can be loaded manually through ASP.NET code (like my example) as well as from a data source.

The BulletedList control is part of the System.Web.UI.WebControls namespace.

–

Most common properties

DisplayMode
Gets or sets the display mode of the list content in a BulletedList control

BulletStyle
Gets or sets the bullet style for the BulletedList control

BackColor/ForeColor
Gets or sets the back/foreground color of the web server control

Border Color/Style/Width
Gets or sets the border color/style/width of the web server control

Font
Gets the font properties associated with the web server control

-

The BulletedList control has three display types:

• Hyperlink
• LinkButton
• Text

-

The following BulletStyles are available for the BulletedList control:

• Circle – Hollow Circle
• Disc – most common Bullet
• LowerAlpha – Letters
• LowerRoman – Roman Numerals
• Numbered
• Square
• UpperAlpha – Letters
• UpperRoman – Roman Numerals
• CustomImage

-

Simple Example of the BulletedList Control

This example fills the control to display.

ASP.NET SOURCE

Below are the current planets in our Solar System.<br />

<asp:BulletedList ID=blPlanets BulletStyle="Square" runat=server>
    <asp:ListItem>Mercury</asp:ListItem>
    <asp:ListItem>Venus</asp:ListItem>
    <asp:ListItem>Earth</asp:ListItem>
    <asp:ListItem>Mars</asp:ListItem>
    <asp:ListItem>Jupiter</asp:ListItem>
    <asp:ListItem>Saturn</asp:ListItem>
    <asp:ListItem>Uranus</asp:ListItem>
    <asp:ListItem>Neptune</asp:ListItem>
</asp:BulletedList>

C# SOURCE

You can also fill the BulletedList control dynamically using the Page load event instead of ASP.NET code.

protected void Page_Load(object sender, EventArgs e)
{
  if (!Page.IsPostBack)
  {
    blPlanets.Items.Add("Mercury");
    blPlanets.Items.Add("Venus");
    blPlanets.Items.Add("Earth");
    blPlanets.Items.Add("Mars");
    blPlanets.Items.Add("Jupiter");
    blPlanets.Items.Add("Saturn");
    blPlanets.Items.Add("Uranus");
    blPlanets.Items.Add("Neptune");
  }
}

RESULT

-

This post concludes my List Control series. There are many other methods of implementing the different List Controls in ASP.NET. I have barely scratched the surface of possibilities.

-

[- Related Links -]
ASP.NET Quickstart Tutorials – BulletedList
ASP.NET Tutorial – BulletedList

There are several list controls available to ASP.NET. They are the DropDownList, ListBox, CheckBoxList, RadioButtonList and BulletedList controls. The one I will go over in this post is the RadioButtonList control.

The ASP.NET RadioButtonList control is used to create a defined list of options in which a user can choose from. Like the DropDownList control, only one item can be selected at a time. Each selectable item in a RadioButtonList control is considered a ListItem element. This control can be loaded manually through ASP.NET code (like my example) as well as from a data source.

The RadioButtonList control is part of the System.Web.UI.WebControls namespace.

Most common properties

AutoPostBack
A Boolean value that specifies whether the form should be posted immediately after one of the items changes select status or not.

CellPadding
The space, in pixels, between the cell walls and the radio button group

DataSource
The data source to use

DataTextField
A field in the data source to be displayed in the radio button group

DataValueField
A field in the data source that specifies the value of each selectable item in the radio button group

id — A unique id for the control

OnSelectedIndexChanged
The name of the function to be executed when one of the items changes select status

RepeatColumns
The number of columns to use when displaying the radio button group.

RepeatDirection
Specifies whether the radio button group should be repeated horizontally or vertically. Legal values are “Horizontal” and “Vertical”.

RepeatLayout
The layout of the radio button group. Can be “Table” or “Flow”.

runat
Specifies that the control is a server control. Must be set to “server”

TextAlign
On which side of the radio button the text should appear (right or left)

-

Simple Example of the CheckBoxList Control

This example fills the control and displays the Selected Item in a label control when the button is accessed.

ASP.NET SOURCE

<asp:RadioButtonList ID="rblPlanets" runat="server" Width="109px">
    <asp:ListItem Value="1">Mercury</asp:ListItem>
    <asp:ListItem Value="2">Venus</asp:ListItem>
    <asp:ListItem Value="3">Earth</asp:ListItem>
    <asp:ListItem Value="4">Mars</asp:ListItem>
    <asp:ListItem Value="5">Jupiter</asp:ListItem>
    <asp:ListItem Value="6">Saturn</asp:ListItem>
    <asp:ListItem Value="7">Uranus</asp:ListItem>
    <asp:ListItem Value="8">Neptune</asp:ListItem>
</asp:RadioButtonList>

C# SOURCE

protected void btnSubmit_Click(object sender, EventArgs e)
{
  lblText.Text = "You selected: " + rblPlanets.SelectedItem.Text;
}

You can also fill the RadioButtonList control dynamically using the Page load event instead of ASP.NET code.

protected void Page_Load(object sender, EventArgs e)
{
  if (!Page.IsPostBack)
  {
    rblPlanets.Items.Add("Mercury");
    rblPlanets.Items.Add("Venus");
    rblPlanets.Items.Add("Earth");
    rblPlanets.Items.Add("Mars");
    rblPlanets.Items.Add("Jupiter");
    rblPlanets.Items.Add("Saturn");
    rblPlanets.Items.Add("Uranus");
    rblPlanets.Items.Add("Neptune");
  }
}

protected void btnSubmit_Click(object sender, EventArgs e)
{
  lblText.Text = "You selected: " + rblPlanets.SelectedItem.Text;
}

RESULT

As I mentioned at the beginning of this post, there are several list controls in ASP.NET. I plan on touching on the other list controls in future posts.

Related Content

• ASP.NET RadioButtonList Control
• ASP.NET Radio Button Sample

There are several list controls available to ASP.NET. They are the DropDownList, ListBox, CheckBoxList, RadioButtonList and BulletedList controls. The one I will go over in this post is the CheckBoxList control.

The ASP.NET CheckBoxList control is used to create a defined list of options in which a user can choose from. With this control, you can select one item or multiple items. Each selectable item in a CheckBoxList control is considered a ListItem element. This control can be loaded manually through ASP.NET code (like my example) as well as from a data source.

The CheckBoxList control is part of the System.Web.UI.WebControls namespace.

–

Most common properties

AutoPostBack
A Boolean value that specifies whether the form should be posted immediately after one of the items changes select status or not.

CellPadding
The space, in pixels, between the cell walls and the check box group

DataSource
The data source to use

DataTextField
A field in the data source to be displayed in the check box group

DataValueField
A field in the data source that specifies the value of each selectable item in the check box group

id — A unique id for the control

OnSelectedIndexChanged
The name of the function to be executed when one of the items changes select status

RepeatColumns
The number of columns to use when displaying the check box group.

RepeatDirection
Specifies whether the check box group should be repeated horizontally or vertically. Legal values are “Horizontal” and “Vertical”.

RepeatLayout
The layout of the check box group. Can be “Table” or “Flow”.

runat
Specifies that the control is a server control. Must be set to “server”

TextAlign
On which side of the check box the text should appear (right or left)

-

Simple Example of the CheckBoxList Control

This example fills the control and displays the Selected Item in a label control when the button is accessed.

ASP.NET SOURCE

<asp:CheckBoxList ID="cblPlanets" runat="server" Width="109px">
    <asp:ListItem Value="1">Mercury</asp:ListItem>
    <asp:ListItem Value="2">Venus</asp:ListItem>
    <asp:ListItem Value="3">Earth</asp:ListItem>
    <asp:ListItem Value="4">Mars</asp:ListItem>
    <asp:ListItem Value="5">Jupiter</asp:ListItem>
    <asp:ListItem Value="6">Saturn</asp:ListItem>
    <asp:ListItem Value="7">Uranus</asp:ListItem>
    <asp:ListItem Value="8">Neptune</asp:ListItem>
</asp:CheckBoxList>

C# SOURCE

protected void btnSubmit_Click(object sender, EventArgs e)
{
  lblText.Text = "You selected: ";

  foreach (ListItem li in cblPlanets.Items)
  {
     if (li.Selected == true)
     {
        lblText.Text = lblText.Text += "~" + li.Text;
     }
   }
}

You can also fill the CheckBoxList control dynamically using the Page load event instead of ASP.NET code.

protected void Page_Load(object sender, EventArgs e)
{
  if (!Page.IsPostBack)
  {
    cblPlanets.Items.Add("Mercury");
    cblPlanets.Items.Add("Venus");
    cblPlanets.Items.Add("Earth");
    cblPlanets.Items.Add("Mars");
    cblPlanets.Items.Add("Jupiter");
    cblPlanets.Items.Add("Saturn");
    cblPlanets.Items.Add("Uranus");
    cblPlanets.Items.Add("Neptune");
  }
}

protected void btnSubmit_Click(object sender, EventArgs e)
{
  lblText.Text = "You selected: ";

  foreach (ListItem li in cblPlanets.Items)
  {
    if (li.Selected == true)
    {
      lblText.Text = lblText.Text += "~" + li.Text;
    }
  }
}

RESULT

-

As I mentioned at the beginning of this post, there are several list controls in ASP.NET. I plan on touching on the other list controls in future posts.

–

Related Content

• Using ASP.NET CheckBoxList Control
• ASP.NET : The checkbox and checkboxlist control

There are several list controls available to ASP.NET. They are the DropDownList, ListBox, CheckBoxList, RadioButtonList and BulletedList controls. The one I will go over in this post is the ListBox control.

The ASP.NET ListBox control is used to create a defined list of options in which a user can choose from. Unlike the DropDownList, which displays only the selected item, the ListBox control displays several items. The control can also be set to allow multiple selections (by holding down the <Ctrl> key). Each selectable item in a ListBox control is considered a ListItem element. This control can be loaded manually through ASP.NET code (like my example) as well as from a data source.

The ListBox control is part of the System.Web.UI.WebControls namespace.

–

Most common properties

AutoPostBack
A Boolean value that specifies whether the form should be posted immediately after the index of the selected item has changed or not. Default is false

BorderColor / BorderStyle / BorderWidth — (3 properties)
Specifies the color / style / width of the border around the drop-down list

DataSource
The data source to use

DataTextField
A field in the data source to be displayed in the drop-down list

DataValueField
A field in the data source that specifies the value of each selectable item in the drop-down list

id — A unique id for the control

OnSelectedIndexChanged
The name of the function to be executed when the index of the selected item has changed

Rows
Specifies the height of the control

runat
Specifies that the control is a server control. Must be set to “server”

SelectionMode
Allows single or multiple selections. Legal values: “single” and “multiple”. Default is “single”

–

Simple Example of the ListBox Control

This example fills the control and displays the Selected Item in a label control when the button is accessed.

ASP.NET SOURCE

<asp:ListBox ID="lstPlanets" runat="server" Width="109px" SelectionMode="Multiple">
    <asp:ListItem Value=?1?>Mercury</asp:ListItem>
    <asp:ListItem Value=?2?>Venus</asp:ListItem>
    <asp:ListItem Value=?3?>Earth</asp:ListItem>
    <asp:ListItem Value=?4?>Mars</asp:ListItem>
    <asp:ListItem Value=?5?>Jupiter</asp:ListItem>
    <asp:ListItem Value=?6?>Saturn</asp:ListItem>
    <asp:ListItem Value=?7?>Uranus</asp:ListItem>
    <asp:ListItem Value=?8?>Neptune</asp:ListItem>
</asp:ListBox>

–

C# SOURCE

protected void btnSubmit_Click(object sender, EventArgs e)
{
  lblText.Text = "You selected: " + lstPlanets.SelectedItem.Text;
}

You can also fill the DropDownList control dynamically using the Page load event instead of ASP.NET code.

protected void Page_Load(object sender, EventArgs e)
{
  if (!Page.IsPostBack)
  {
     lstPlanets.Items.Add("Mercury");
     lstPlanets.Items.Add("Venus");
     lstPlanets.Items.Add("Earth");
     lstPlanets.Items.Add("Mars");
     lstPlanets.Items.Add("Jupiter");
     lstPlanets.Items.Add("Saturn");
     lstPlanets.Items.Add("Uranus");
     lstPlanets.Items.Add("Neptune");
  }
}

protected void btnSubmit_Click(object sender, EventArgs e)
{
  lblText.Text = "You selected: ";

  foreach (ListItem li in lstPlanets.Items)
  {
     if (li.Selected == true)
     {
       lblText.Text = lblText.Text += "~" + li.Text;
     }
  }
}

–

RESULT

–

As I mentioned at the beginning of this post, there are several list controls in ASP.NET. I plan on touching on the other list controls in future posts.

–

[- Related Links -]
ListBox Control Overview
ASP.NET : The listbox control

–

There are several list controls available to ASP.NET. They are the DropDownList, ListBox, CheckBoxList, RadioButtonList and BulletedList controls. The one I will go over in this post is the DropDownList control.

In simple terms, a drop-down list is a defined list of options in which a user can choose from. The ASP.NET DropDownList control is used to create such a list for a web form. Each selectable item in a DropDownList control is considered a ListItem element. This control can be loaded manually through ASP.NET code (like my example) as well as from a data source.

The DropDownList control is part of the System.Web.UI.WebControls namespace.

Most common properties

AutoPostBack
A Boolean value that specifies whether the form should be posted immediately after one of the items changes select status or not. Default is false

BorderColor / BorderStyle / BorderWidth
Specifies the color / style / width of the border around the drop-down list

DataSource
The data source to use

DataTextField
A field in the data source to be displayed in the drop-down list

DataValueField
A field in the data source that specifies the value of each selectable item in the drop-down list

id – A unique id for the control

OnSelectedIndexChanged
The name of the function to be executed when the index of the selected item has changed

runat
Specifies that the control is a server control. Must be set to “server”

–

Simple Example of the DropDownList Control

This example fills the control and displays the Selected Item in a label control when the button is accessed.

ASP.NET SOURCE

<asp:DropDownList id="ddlPlanets" runat="server" Width="116px">
    <asp:ListItem Value="1">Mercury</asp:ListItem>
    <asp:ListItem Value="2">Venus</asp:ListItem>
    <asp:ListItem Value="3">Earth</asp:ListItem>
    <asp:ListItem Value="4">Mars</asp:ListItem>
    <asp:ListItem Value="5">Jupiter</asp:ListItem>
    <asp:ListItem Value="6">Saturn</asp:ListItem>
    <asp:ListItem Value="7">Uranus</asp:ListItem>
    <asp:ListItem Value="8">Neptune</asp:ListItem>
</asp:DropDownList>
<asp:Button Runat="server" ID="btnSubmit" Text="Submit"
    OnClick="btnSubmit_Click">
</asp:Button>
<asp:Label id="lblText" runat="server"></asp:Label>

–

C# SOURCE

protected void btnSubmit_Click(object sender, EventArgs e)
{
  lblText.Text = "You selected: " + ddlPlanets.SelectedItem.Text;
}

You can also fill the DropDownList control dynamically using the Page load event instead of filling it in ASP.NET code.

protected void Page_Load(object sender, EventArgs e)
{
  if (!Page.IsPostBack)
  {
    ddlPlanets.Items.Add("Mercury");
    ddlPlanets.Items.Add("Venus");
    ddlPlanets.Items.Add("Earth");
    ddlPlanets.Items.Add("Mars");
    ddlPlanets.Items.Add("Jupiter");
    ddlPlanets.Items.Add("Saturn");
    ddlPlanets.Items.Add("Uranus");
    ddlPlanets.Items.Add("Neptune");
  }
}

protected void btnSubmit_Click(object sender, EventArgs e)
{
  lblText.Text = "You selected: " + ddlPlanets.SelectedItem.Text;
}

–

RESULT

As I mentioned at the beginning of this post, there are several list controls in ASP.NET. I plan on touching on the other list controls (ListBox, CheckBoxList, RadioButtonList, etc) in future posts.

–

[- Related Links -]
ASP.NET DropDownList Web Control, Part 1
ASP.NET DropDownList Web Control, Part 2
Working with DropDownList and ListBox Controls in ASP.NET

–