<%@ Import Namespace="System.Data" %>
<%@ Import Namespace="System.Data.OleDb" %>
<html>
<head>
<title>DataGrid SelectedIndex Property</title>
<link rel="stylesheet" href="/shared/netdemos.css">
<style type="text/css">
.model {
width:100%; height:18pt;
font:bold 13pt verdana; color:steelblue;
filter:shadow ( color=#cccccc ); padding-left:8}
.desc {
font:bold 11pt arial,verdana,sans-serif; background:#cc9;
border:1px inset; padding:10; margin-bottom:10}
.specs {
font-size:9pt; background:palegoldenrod;
border:1px inset; padding-right:5}
</style>
<script language="C#" runat="server" src="fetchData_oledb.cs" />
<script language="C#" runat="server">
void Page_Load ( Object src, EventArgs e ) {
if ( !IsPostBack ) {
string query = "SELECT DISTINCT Type FROM Products";
myList.DataSource = fetchData ( query, "gear" );
myList.DataBind ( );
getItems ( null, null );
}
}
void resetPage ( Object src, EventArgs e ) {
// reset CurrentPageIndex
myGrid.CurrentPageIndex = 0;
// fetch and rebind the data.
getItems ( null, null );
}
void getPage ( Object src, DataGridPageChangedEventArgs e ) {
// set CurrentPageIndex to the page the user clicked.
myGrid.CurrentPageIndex = e.NewPageIndex;
// fetch and rebind the data.
getItems ( null, null );
}
void getItems ( Object src, EventArgs e ) {
string query = "SELECT ProductId, ( Brand + ' ' + Model ) as Product, " +
"Model, Price FROM Products where Type='" + myList.SelectedItem + "'";
myGrid.DataSource = fetchData ( query, "gear" );
myGrid.DataBind ( );
myGrid.SelectedIndex = 0;
getSelected ( null, null );
}
void getSelected ( Object src, EventArgs e ) {
string id = myGrid.DataKeys [ myGrid.SelectedIndex ].ToString ( );
string query = "SELECT * FROM Products where ProductId = '" + id + "'";
myDetailsList.DataSource = fetchData ( query, "gear" );
myDetailsList.DataBind ( );
}
</script>
</head>
<body>
<!-- #include virtual="~/shared/top.inc" -->
<div class="header"><h2>DataGrid SelectedIndex Property</h2></div>
<hr size=1 width=92%>
<div align="center">
<form runat="server">
<table width="95%" cellpadding=5>
<tr valign="top">
<td width="55%">
<asp:datalist id="myDetailsList" runat="server"
cellpadding=10
enableviewstate=false>
<itemtemplate>
<img align="top" runat="server"
src='<%# Eval ( "ProductId", "~/shared/images/gear/{0}.jpg" ) %>' />
<p class="model"><%# Eval ( "Brand" ) %>
<%# Eval ( "Model" ) %>
</p>
<p class="desc">
<%# Eval ( "Description" ) %>
</p>
<div class="specs">
<%# Eval ( "Specs" ) %>
</div>
<h5 align="right">
Price:</b> <%# Eval ( "Price", "{0:c}" ) %>
</h5>
</itemtemplate>
</asp:datalist>
</td>
<td width="45%">
<p>Select Gear: <asp:dropdownlist id="myList" runat="server"
datatextfield="Type" onSelectedIndexChanged="resetPage" autopostback />
<p>
<asp:datagrid id="myGrid" runat="server"
width="100%" cellpadding=5 showheader=false
font-size="9pt" gridlines="horizontal"
datakeyfield="productid"
autogeneratecolumns=false
allowpaging pagesize=5
onPageIndexChanged="getPage"
onSelectedIndexChanged="getSelected">
<selecteditemstyle backcolor="khaki" />
<pagerstyle
nextpagetext="Next" prevpagetext="Back"
backcolor="navy" forecolor="lime"
font-name="comic sans ms" font-size=9pt font-bold
pagebuttoncount=10
position="topandbottom" horizontalalign="right" />
<columns>
<asp:templatecolumn>
<itemtemplate>
<asp:linkbutton runat="server" commandname="select"
text='<%# Eval ( "Product" ) %>' />
<p>
<b>Price: <%# Eval ( "Price", "{0:c}" ) %></b>
</itemtemplate>
</asp:templatecolumn>
<asp:templatecolumn>
<itemtemplate>
<asp:imagebutton width=60 align="right" runat="server"
commandname="select"
imageurl='<%# Eval ( "ProductID",
"~/shared/images/gear/{0}.jpg" ) %>'
alt='<%# Eval ( "Model" ) %>' />
</itemtemplate>
</asp:templatecolumn>
</columns>
</asp:datagrid>
</td></tr>
</table>
</form>
</div>
<hr size=1 width=92%>
<!-- #include virtual="~/shared/viewsrc.inc" -->
</body>
</html>