<%@ Import Namespace="System.Data" %>
<%@ Import Namespace="System.Data.OleDb" %>
<%@ Register tagprefix="ie" namespace="Microsoft.Web.UI.WebControls" assembly="Microsoft.Web.UI.WebControls" %>
<html>
<head>
<title>Using the TabStrip with the MultiPage Control</title>
<script language="C#" runat="server" src="~/shared/fetchData_oledb.cs"></script>
<script language="C#" runat="server">
void Page_Load ( Object source, EventArgs e ) {
if ( ! IsPostBack ) {
gvPlans.SelectedIndex = 0;
gvPlans.DataBind ( );
getSelected ( null, null );
}
}
void getPlans ( Object src, EventArgs e ) {
gvPlans.PageIndex = 0;
gvPlans.SelectedIndex = 0;
gvPlans.DataBind ( );
getSelected ( null, null );
}
void getSelected ( Object src, EventArgs e ) {
string id = gvPlans.SelectedValue.ToString ( );
string query = "Select* FROM Plans WHERE PlanID = '" + id + "'";
fvPlan.DataSource = fetchReader ( query, "plans" );
fvPlan.DataBind ( );
}
void resetSelected ( Object src, EventArgs e ) {
gvPlans.SelectedIndex = 0;
gvPlans.DataBind ( );
getSelected ( null, null );
}
</script>
<script language="JavaScript" src="/shared/css.js"></script>
<style type="text/css">
.tabs {
background: ghostwhite; border: 1px inset}
.desc {
font:bold 11pt arial,verdana,sans-serif; background:khaki;
border:1px inset; padding:10; margin-bottom:10}
.features {
font-size:9pt; background:#efefef;
border:1px inset; padding-right:5; margin-bottom:10}
.specs {
font-size:9pt; background:beige;
border:1px inset; padding-right:5}
</style>
</head>
<body>
<!-- #include virtual="~/shared/top.inc -->
<div class="header"><h2>Using the TabStrip with the MultiPage Control</h2></div>
<hr size=1 width=92%>
<form runat="server">
<table align="center" cellpadding=0 cellspacing=0 width=100%>
<tr align="center" valign="top">
<td width=30%>
<div>Design Type: <asp:dropdownlist id="typesSelect" runat="server"
datasourceid="planTypes" datatextfield="Type"
onselectedindexchanged="getPlans" autopostback /></div>
<br>
<table width=96% style="background-color: slategray; color: khaki; font: bold 9pt Comic Sans MS">
<tr height=20pt>
<td>Select Plan</td></tr>
</table>
<asp:gridview id="gvPlans" runat="server"
datasourceid="plans" datakeynames="planId"
width=96% gridlines="horizontal"
autogeneratecolumns=false
allowpaging pagesize=5
showheader=false font-size=9pt
onSelectedIndexChanged="getSelected"
onPageIndexChanged="resetSelected">
<selectedrowstyle backcolor="lightgreen" />
<pagersettings
mode="nextpreviousfirstlast" />
<pagerstyle
backcolor="steelblue" forecolor="beige"
horizontalalign="right" />
<columns>
<asp:imagefield dataimageurlfield="PlanID"
dataimageurlformatstring = "~/shared/images/plans/thumbs/{0}.jpg"
dataalternatetextfield="Model"
readonly="true">
<controlstyle width=75
borderwidth=1 borderstyle="inset" />
</asp:imagefield>
<asp:templatefield>
<itemtemplate>
<asp:linkbutton runat="server" commandname="select"
text='<%# Eval ( "Model" ) %>' />
</itemtemplate>
</asp:templatefield>
</columns>
</asp:gridview>
</td>
<td width=80%>
<asp:formview id="fvPlan" width=96% runat="server">
<itemtemplate>
<div class="header"><h3 style="color:maroon"><%# Eval ( "Model" ) %></h2></div>
<br>
<div class="tabs">
<ie:tabstrip id="tabsPlan" runat="server"
targetid="planInfo" width=100% align="center"
tabdefaultstyle="background-color:steelblue; height:30;
font-weight:bold; font-size:9pt; color:beige; text-align:center"
tabhoverstyle="background-color:maroon; color:khaki"
tabselectedstyle="background-color:ghostwhite; color:maroon">
<ie:tab text="Overview" />
<ie:tab text="Features" />
<ie:tab text="Specs" />
</ie:tabstrip>
<div style="padding: 10 10">
<ie:multipage id="planInfo" runat="server" style="font-size: 9pt">
<ie:pageview id="overview">
<div align="center"><table width=96% cellpadding=10
style="background-color:whitesmoke; border:2px outset">
<tr valign="top">
<td align="center" width=290>
<img width=290 runat="server"
src='<%# Eval ( "PlanID", "~/shared/images/plans/{0}.jpg" ) %>'
alt='<%# Eval ( "Model" ) %>'
style="border:1px inset">
</td>
<td>
<asp:detailsview id="dvPlans" runat="server"
width=100% cellpadding=3
datasourceid="details"
headertext="Plan Details">
<headerstyle font-bold horizontalalign="center"
backcolor="slategray" forecolor="khaki" />
<rowstyle backcolor="whitesmoke" />
</asp:detailsview>
</td></tr>
</table></div>
</ie:pageview>
<ie:pageview id="features">
<div class="desc"><%# Eval ( "Description" ) %></div>
<div class="features"><%# Eval ( "Features" ) %></div>
</ie:pageview>
<ie:pageview id="specs">
<div class="specs"><%# Eval ( "Specs" ) %></div>
</ie:pageview>
</ie:multipage>
</div>
</div>
</itemtemplate>
</asp:formview>
</td></tr>
</table>
<asp:accessdatasource id="planTypes" runat="server"
datafile="~/app_data/plans.mdb"
selectcommand="SELECT DISTINCT Type FROM Plans WHERE not Type=''"
datasourcemode="DataReader" />
<asp:accessdatasource id="plans" runat="server"
datafile="~/app_data/plans.mdb"
selectcommand="SELECT Type, PlanID, Model FROM Plans"
filterexpression="Type='{0}'">
<filterparameters>
<asp:controlparameter controlid="typesSelect" propertyname="SelectedValue" />
</filterparameters>
</asp:accessdatasource>
<asp:accessdatasource id="details" runat="server"
datafile="~/app_data/plans.mdb"
selectcommand="SELECT Design, PlanId, Area, Bedrooms, Baths, Cost FROM Plans"
filterexpression="PlanId='{0}'">
<filterparameters>
<asp:controlparameter controlid="gvPlans" propertyname="SelectedValue" />
</filterparameters>
</asp:accessdatasource>
</form>
<hr size=1 width=92%>
<!-- #include virtual="~/shared/viewsrc.inc" -->
</body>
</html>