2. The List controls enable you to display simple lists of options. The five
List controls inherit from the base ListControl class. This means that all
the List controls share a common set of properties and methods.
Declaring List Items: The List controls render a list of options. Each
option is represented by an instance of the ListItem class.
The ListItem control supports the following five properties: .
Attributes—Enables you to add HTML attributes to a list item. .
Enabled—Enables you to disable a list item.
Selected—Enables you to mark a list item as selected.
Text—Enables you to specify the text displayed by the List Item.
Value—Enables you to specify a hidden value associated with the List
Item.
3. The List controls support three properties that you
can use to determine the selected list item: .
SelectedIndex—Gets or sets the index of the selected
list item.
SelectedItem—Gets the first selected list item.
SelectedValue—Gets or sets the value of the first
selected list item.
4. DropDownList control
The DropDownList control enables you to display a list of options while
requiring a minimum of screen real estate. A user can select only one
option at a time when using this control
The DropDownList control has a SelectedIndexChanged event handler.
The SelectedIndexChanged event is raised whenever you make a new
selection in the List control.The ddl1_SelectedIndexChanged() method
displays the selected list item in a Label control
protected void btnSubmit_Click(object sender, EventArgs e)
{
label.Text = ddl1.SelectedItem.Text;
}
7. Implementing dropdownlist using databinding
<asp:DropDownList id=”ddl1”
DataSourceID=” SqlDataSource1”
DataTextField=”Title”
DataValueField=”Id”
Runat=”server” />
<asp:SqlDataSource id=” SqlDataSource1”
SelectCommand=”SELECT Id, Title FROM Movies”
ConnectionString=”<%$ ConnectionStrings:Movies %>”
Runat=”server” />
8. WORKING WITH RADIOBUTTONLIST
The RadioButtonList control, like the DropDownList control, enables a
user to select only one list item at a time. The RadioButttonList control
displays a list of radio buttons that can be arranged either horizontally
or vertically
To display the selected item in Radiobuttonlist
protected void btnSubmit_Click(object sender, EventArgs e)
{
label.Text = rbl1.SelectedItem.Text;
}
9. Implementing RadioButton using databinding
<asp:RadioButtonList id=”rbl1”
DataSourceID=” SqlDataSource1”
DataTextField=”Title”
DataValueField=”Id”
RepeatColumns=”3” Runat=”server”
/>
<asp:SqlDataSource id=” SqlDataSource1”
SelectCommand=”SELECT Id, Title FROM Movies”
ConnectionString=”<%$ ConnectionStrings:Movies %>”
Runat=”server”
/>
10. RadioButtonList control includes three properties that have an effect on
its layout:
RepeatColumns—The number of columns of radio buttons to display.
RepeatDirection—The direction that the radio buttons repeat. Possible
values are Horizontal and Vertical.
RepeatLayout—Determines whether the radio buttons display in an
HTML table. Possible values are Table and Flow.
By default, the radio buttons rendered by the RadioButtonList control
are rendered in an HTML table. If you set the RepeatLayout property to
the value Flow, the radio buttons are not rendered in a table. Even
when the RadioButtonList renders its items in Flow layout mode, you
can specify multiple columns.
11. Working with ListBox
The ListBox control is similar to the DropDownList control with two
important differences. First, the ListBox control requires more screen real
estate because it always displays a certain number of list items.
The dropdownlist control allow user to select maximum only one item at a
time, on other hand listbox control allow user to select multiple items same
time. so we can also say listbox is a multi row selection box control.
<asp:ListBox ID="ListBox1" runat="server" >
<asp:ListItem Value="1">ABC</asp:ListItem>
<asp:ListItem Value="2">PQR</asp:ListItem>
<asp:ListItem Value="3">MNO</asp:ListItem>
<asp:ListItem Value="4">XYZ</asp:ListItem>
</asp:ListBox>
12. The ListBox control 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
The ListBox 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.
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
foreach (ListItem item in lstMovies.Items) if (item.Selected)
label.Text += “<li>” + item.Text;
13. Implementing ListBox using databinding
<asp:ListBox id=”lst1” DataSourceID=”SqlDataSource1”
DataTextField=”Title”
DataValueField=”Id” Rows=”8”
Runat=”server” />
<asp:SqlDataSource id=” SqlDataSource1”
SelectCommand=”SELECT Id, Title FROM Movies”
ConnectionString=”<%$ ConnectionStrings:Movies %>”
Runat=”server” />
14. WORKING WITH CHECKBOXLIST
The CheckBoxList control renders a list of check boxes, which can be
rendered horizontally or vertically. Unlike the other List controls, a
user always can select multiple items when using a CheckBoxList
control.
foreach (ListItem item in cblMovies.Items) if (item.Selected)
lblMovie.Text += “<li>” + item.Text;
<asp:CheckBoxList ID="CheckBoxList1" runat="Server">
<asp:ListItem Text="Red" Value="red"></asp:ListItem>
<asp:ListItem Text="Blue" Value="blue"></asp:ListItem>
<asp:ListItem Text="Green" Value="green"></asp:ListItem>
</asp:CheckBoxList>
15. 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.
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.
16. Implementing checkBoxList using databinding
<asp:CheckBoxList id=”cbl1”
DataSourceID=” SqlDataSource 1”
DataTextField=”Title”
DataValueField=”Id”
RepeatColumns=”2”
Runat=”server”
/>
<asp:SqlDataSource id=” SqlDataSource1”
SelectCommand=”SELECT Id, Title FROM Movies”
ConnectionString=”<%$ ConnectionStrings:Movies %>”
Runat=”server”
/>
17. WORKING WITH GRIDVIEW
The GridView control is the workhorse of ASP.NET Framework. It is
one of the most feature-rich and complicated of all the ASP.NET
controls.
The GridView control enables you to display, select, sort, page, and edit
data items such as database records.
GridView control is used to display whole table data on web page. In GridView
control each column define a filed or title, while each rows represents a
record or data.
Syntax :
<asp:GridView ID=”GridView1″ runat=”server”>
</asp:GridView>
18. <asp:Datagrid
id=“dg1”
runat=“server”/>
Sub Page_Load(By Val Sender as Object, ByVal E as EventArgs)
If Not IsPostBack Then
Dim MyDt As New DataTable
Dim MyRow As New DataRow
MyDT.Columns.Add(New DataColumn(“empid”,_GetType(Int32)))
MyDT.Columns.Add(New DataColumn(“empName”,_GetType(String)))
MyDT.Columns.Add(New DataColumn(“BirthDate”,_GetType(Date)))
MyDT.Columns.Add(New DataColumn(“Salary”,_GetType(Int32)))
MyRow = MyDT.NewRow()
26. Without using datasource control
protected void Page_Load(object sender, EventArgs e)
{
using (SqlConnection con = new SqlConnection("data
source=.; database=student; integrated security=SSPI"))
{
SqlDataAdapter sde = new SqlDataAdapter("Select *
from student", con);
DataSet ds = new DataSet();
sde.Fill(ds);
DataGrid1.DataSource = ds;
DataGrid1.DataBind();
}
}
27. Using datasource control
<asp:GridView ID="GridView1" runat="server"
AutoGenerateColumns="False"
DataSourceID="SqlDataSource1">
<asp:SqlDataSource id=” SqlDataSource1”
SelectCommand=”SELECT Id, Title FROM Movies”
ConnectionString=”<%$ ConnectionStrings:Movies %>” Runat=”server” />
28. Repeater Control
A Control that is similar to DataGrid control. We
bind two dimensional datasource to Repeater
Difference between two controls lies in how they are
rendered
Repeater is a low-level control where we define
templates that are used to render data for that
particular row
The Repeater control is used to display a repeated
list of items that are bound to the control. The
Repeater control may be bound to a database table,
an XML file, or another list of items.
29. Some points about Repeater Control
It is used to display multiple tuple.
It is an unformatted control. The Repeater control is
a basic templated data-bound list. It has no built-in
layout or styles, so you must explicitly declare all
layout, formatting, and style tags within the control's
templates.
To create a table using templates, include the begin
table tag (<table>) in the HeaderTemplate, a single
table row tag (<tr>) in the ItemTemplate, and the
end table tag (</table>) in the FooterTemplate.
30.
31. The Repeater control has five different templates for various purposes. Each
template has its own functionality
<HeaderTemplate> </HeaderTemplate>: This is the first element, which will
display the Header for the list of values and displayed only once.
<ItemTemplate> </ItemTemplate>: The actual list of data fetched from the
source will be repeatedly displayed by the ItemTemplate element
<AlternatingItemTemplate> </AlternatingItemTemplate>: Add this
element immediately after the ItemTemplate. It also shows data repeatedly as the
alternative row in the list of elements.
<SeparatorTemplate> </SeparatorTemplate>: This element will show
a separator between each row of data, like a horizontal line.
<FooterTemplate> </FooterTemplate>: Finally, the footer of the list and like
the header template, this element will also show up just once as the footer of the
entire list.
32.
33.
34.
35. The BulletedList control creates an unordered or ordered
(numbered) list of items, which render as HTML ul or ol
elements, respectively.
Scenarios
BulletedList is used to do the following:
Specify the appearance of the items and of the bullets or
numbers in a list.
Define the list items statically or by binding the control
to data.
Respond to user clicks on items.
36. The BulletedList control derives from the
same ListControl classthe ListBox, DropDownList, and other ASP.NET
list controls.
BulletedList control is very rich in displaying the items in different
styles. Each list item can be rendered as plain text, a LinkButton
control, or a link to another webpage
To specify the individual list items that you want to appear in
a BulletedList control, place a ListItem object for each entry between
the opening and closing tags of the BulletedList control.
To specify the bullet type to use to display list items in
a BulletedList control, set the BulletStyle property
37. Bullet style Description
NotSet Not set.
Numbered A number.
LowerAlpha A lowercase letter.
UpperAlpha An uppercase letter.
LowerRoman A lowercase Roman numeral.
UpperRoman An uppercase Roman numeral.
Disc A filled circle.
Circle An empty circle.
Square A filled square.
CustomImage A custom image.
38. FirstBulletNumber is used to specify the value that starts the
numbering of list items in an ordered BulletedList control. The value
that is assigned to the FirstBulletNumber property is ignored, if
the BulletStyle property is set to the Disc, Square, Circle,
or CustomImage field
If you set BulletStyle property to the value of CustomImage to specify a
custom image for the bullet, you must set the BulletImageUrl property
also to specify the location of the image file.
39. Display Mode property
To specify the display behavior of the list items in a BulletedList. The
defined display behaviors are Text, HyperLink, and LinkButton
Hyperlink: When a hyperlink is clicked, it navigates to a URL. Use
the Value property to specify the URL that a hyperlink navigates to.
LinkButton: The BulletedList control displays list items as links that
post back to the server when clicked. To programmatically control the
actions that are performed when a link button is clicked, provide an
event handler for the Click event. Use the event data of
the BulletedListEventArgs class to determine the index of the link
button in a BulletedList that was clicked.
40. DATALIST CONTROL
ASP.NET DataList is a data-bound control to show and manipulate data in a web
application. It is a hybrid control that can combine other ASP.Net commands, and it is
present in the form. The template fields control the appearance of ASP.NET DataList.
Templates
We can manipulate the contents of the DataList control by using templates. The following
table lists the supported templates.
AlternatingItemTemplate: It provides the layout and content for alternating items in
the ASP.NET DataList. If not defined, it uses ItemTemplate.
EditItemTemplate: It provides the content and layout for the item currently being
edited in the DataList. If not defined, it uses ItemTemplate.
FooterTemplate: It provides the layout and content for the footer section of the
DataList. If not defined, the footer section will not be displayed.
HeaderTemplate: It provides the layout and content for the header section of the
ASP.NET DataList. If not defined, the header section will not be displayed.
ItemTemplate: A required template that provides the content and layout for the
DataList.
SelectedItemTemplate: It provides the layout and content for the currently selected
item in the DataList. If not specified, it uses ItemTemplate.
SeparatorTemplate: If defined, provide the content and layout for the separator
between items in the DataList. If not specified, we will not display a separator.
41. Customizing the Appearance of the DataList Control
We may customize the appearance of the DataList control by setting the
style properties for the different parts of the control.
AlternatingItemStyle: It specifies the style for alternating items in the
DataList control.
EditItemStyle: It defines the style for the item being edited in the
DataList control.
EditStyle: We use it to apply styles to an EditItemTemplate.
FooterStyle: It specifies the style for the footer in the DataList control.
HeaderStyle: It defines the style for the header in the DataList control.
ItemStyle: It defines the style for the items in the DataList control.
SelectedItemStyle: It represents the style for the selected item in the
DataList control.
SeparatorStyle: It specifies the style for the separator between the items
in the DataList.