Advance Web Programming

Advance Web Advance Web ProgrammingProgrammingAdvance Web Advance Web ProgrammingProgramming

ออ..ชไลเวท พิพิ�ฒพิรรณวงศ์�ชไลเวท พิพิ�ฒพิรรณวงศ์�Chalaivate PipatpannawongComputer InstructorMicrosoft Certificate ProfessionalWeb : www.9Expert.co.th ; Thaiwebdev.comE-Mail: [email protected]

ปริ�ญญาโท สาขาวิ�ชา เทคโนโลยี�สาริสนเทศ

ITEC5620 - Advance Web Programming

What's New with What's New with Visual Studio Visual Studio 2005 and 2005 and ASP.NET 2.0ASP.NET 2.0

What's New with What's New with Visual Studio Visual Studio 2005 and 2005 and ASP.NET 2.0ASP.NET 2.0

ITEC5620 - Advance Web ProgrammingITEC5620 - Advance Web Programming::::

3ปริ�ญญาโท สาขาวิ�ชา เทคโนโลยี�สาริสนเทศ มหาวิ�ทยีาล�ยีเทคโนโลยี�มหานคริ

New Features at New Features at a Glancea Glance

DataControls

DataControls

LoginControls

LoginControls Web PartsWeb Parts Other New

Controls

Other NewControls

Master PagesMaster Pages Themesand Skins

Themesand Skins

Mobility andLocalization

Mobility andLocalization CompilationCompilation

MembershipMembership RoleManagement

RoleManagement ProfilesProfiles ConfigurationConfiguration

SiteMaps

SiteMaps

HealthMonitoring

HealthMonitoring

OtherServices

OtherServices

Con

trols

Pag

eFr

am

ew

ork

Serv

ices

an

d A

PIs



What's New in Data What's New in Data AccessAccess

Data source controlsDeclarative 2-way data binding

Data controlsGridView - Like the DataGrid, only betterDetailsView - Companion to GridView

SQL cache dependenciesKey cached items to database entities

Simplified data binding expressions



ASP.NET 1.x Data ASP.NET 1.x Data BindingBinding<asp:DataGrid ID="MyDataGrid" RunAt="server" /> ...<script language="C#" runat="server">void Page_Load (Object sender, EventArgs e){ SqlConnection connection = new SqlConnection("server=localhost;database=pubs;integrated security=true"); try { connection.Open (); SqlCommand command = new SqlCommand ("select title_id, titles, price from titles"); MyDataGrid.DataSource = command.ExecuteReader (); MyDataGrid.DataBind (); } finally { connection.Close (); }}</script>

<asp:DataGrid ID="MyDataGrid" RunAt="server" /> ...<script language="C#" runat="server">void Page_Load (Object sender, EventArgs e){ SqlConnection connection = new SqlConnection("server=localhost;database=pubs;integrated security=true"); try { connection.Open (); SqlCommand command = new SqlCommand ("select title_id, titles, price from titles"); MyDataGrid.DataSource = command.ExecuteReader (); MyDataGrid.DataBind (); } finally { connection.Close (); }}</script>



ASP.NET 2.0 Data ASP.NET 2.0 Data BindingBinding

<asp:SqlDataSource ID="Titles" RunAt="server" ConnectionString="server=localhost; database=pubs;integrated security=true" SelectCommand="select title_id, title, price from titles"/><asp:DataGrid DataSourceID="Titles" RunAt="server" />

<asp:SqlDataSource ID="Titles" RunAt="server" ConnectionString="server=localhost; database=pubs;integrated security=true" SelectCommand="select title_id, title, price from titles"/><asp:DataGrid DataSourceID="Titles" RunAt="server" />

Declarative Declarative Data BindingData BindingDeclarative Declarative Data BindingData Binding

Chalaivate Pipatpannawong

Chalaivate.COM



What's New for What's New for UIsUIs

Master pages"Visual inheritance" for Web pagesApplied declaratively or programmatically

Themes and skinsTheme controls, pages, and entire sitesApplied declaratively or programmatically

New controls (more than 50 in all)Menus, TreeViews, Wizards, and more



Theming a PageTheming a Page<%@ Page Theme="BasicBlue"><%@ Page Theme="BasicBlue">

Before After

Chalaivate PipatpannawongComputer [email protected]



What's New in What's New in SecuritySecurity

Membership serviceService for managing users and credentialsProvider-based for flexible data storage

Login controlsControls for logging in, creating new users,

recovering lost passwords, and more Role Management service

Combine forms authentication and role-based authorization without writing code!



Validating LoginsValidating Logins

if (Membership.ValidateUser (UserName.Text, Password.Text))

RedirectFromLoginPage (UserName.Text, RememberMe.Checked);

if (Membership.ValidateUser (UserName.Text, Password.Text))

RedirectFromLoginPage (UserName.Text, RememberMe.Checked);



The Login The Login ControlControl

<html> <body> <form runat="server"> <asp:Login RunAt="server" /> </form> </body></html>

<html> <body> <form runat="server"> <asp:Login RunAt="server" /> </form> </body></html>

Membership Membership and Loginsand LoginsMembership Membership and Loginsand Logins




ProfilesProfiles Store per-user data persistently

Strongly typed access (unlike session state)On-demand lookup (unlike session state)Long-lived (unlike session state)Supports authenticated and anonymous

users Accessed through dynamically compiled

HttpProfileBase derivatives (HttpProfile) Provider-based for flexible data storage



Defining a ProfileDefining a Profile

<configuration> <system.web> <profile> <properties> <add name="ScreenName" /> <add name="Posts" type="System.Int32"

defaultValue="0" /> <add name="LastPost" type="System.DateTime" /> </properties> </profile> </system.web></configuration>

<configuration> <system.web> <profile> <properties> <add name="ScreenName" /> <add name="Posts" type="System.Int32"

defaultValue="0" /> <add name="LastPost" type="System.DateTime" /> </properties> </profile> </system.web></configuration>



Using a ProfileUsing a Profile

// Increment the current user's post countProfile.Posts = Profile.Posts + 1;

// Update the current user's last post dateProfile.LastPost = DateTime.Now;

// Increment the current user's post countProfile.Posts = Profile.Posts + 1;

// Update the current user's last post dateProfile.LastPost = DateTime.Now;

Persisting Persisting Data with Data with ProfilesProfiles

Persisting Persisting Data with Data with ProfilesProfiles




Site NavigationSite Navigation Navigation UIs are tedious to implement

Especially if they rely on client-side script New controls simplify site navigation

TreeView and Menu - Navigation UISiteMapDataSource - XML site mapsSiteMapPath - "Bread crumb" control

Public API provides foundation for controls Provider-based for flexibility

Data-Driven Data-Driven Site Site NavigationNavigation

Data-Driven Data-Driven Site Site NavigationNavigation




ProvidersProvidersNew model for storing and managing state

Makes storage adaptable to different mediaUsed by many key ASP.NET services

Membership serviceRole Management service and more

Built-in providers make ASP.NET state storage very flexible

Custom providers make it infinitely flexible



The Provider The Provider ModelModel

Membership API

MembershipData

Access OtherData Stores

Controls LoginLogin LoginStatusLoginStatus LoginViewLoginView

AccessMembershipProviderAccessMembershipProvider Other MembershipProviders

Other MembershipProviders

Membership Providers

MembershipMembership MembershipUserMembershipUser

SqlMembershipProviderSqlMembershipProvider

SQL Server

Other LoginControls

Other LoginControls



ConfigurationConfigurationAdministrative tools

ASP.NET MMC snap-inWeb Site Administration Tool (Webadmin.axd)

Configuration APIRead/write access to configuration settingsSimplified custom configuration sections

InstrumentationPerf counters, health monitoring, and more

Web Site Web Site AdministratiAdministration Toolon Tool

Web Site Web Site AdministratiAdministration Toolon ToolChalaivate Pipatpannawong

Chalaivate.COM



Web PartsWeb Parts Framework for building portal-style apps

Patterned after SharePoint Portal ServerSystem.Web.UI.WebControls.WebParts

Rich UIs with minimal codeEdit page layout using drag-and-dropEdit appearance and behavior and more

Seamless personalization

Intercommunication ("connections")

Web PartsWeb PartsWeb PartsWeb Parts


Chalaivate.COM



What's New in What's New in MobilityMobility

Unified Control ArchitectureAdapters enable pages and controls to render

markup for different device typesWML adapters provided by third parties

Device filters

<asp:Label Text="Hello, world" RunAt="server" Nokia:Text="Hello, Nokia" Up:Text="Hello, OpenWave" />

<asp:Label Text="Hello, world" RunAt="server" Nokia:Text="Hello, Nokia" Up:Text="Hello, OpenWave" />

Nokia browsersOpenWave browsers



What's New in What's New in LocalizationLocalizationAuto-culture handling

Declarative mapping of Accept-Language headers to relevant thread properties

Simplified resource handlingDeclarative mapping of control properties to resources using <%$ … %> expressions

Strongly typed programmatic resource loading

<asp:localize runat="server"> and more



What's New in What's New in CompilationCompilationAutocompile anything

CS files, VB files, RESX files, and so onSimply drop files into special directoriesExtensible with custom build providers

New code-behind model (code-behind 2.0)Fixes fragilities in version 1Relies on partial class support in compilers

Precompile and deploy without source



Dynamic Dynamic CompilationCompilation

vroot

Code

Resources

CS

VB

WSDL

XSD

RESX

RESOURCE

Files auto-compiled on first access



Build ProvidersBuild Providers

<compilation ... > <buildProviders> <add extension=".resx" appliesTo="Code,Resources" type="System.Web.Compilation.ResXBuildProvider"/> <add extension=".wsdl" appliesTo="Code" type="System.Web.Compilation.WsdlBuildProvider"/> <add extension=".xsd" appliesTo="Code" type="System.Web.Compilation.XsdBuildProvider"/> ... </buildProviders></compilation>

<compilation ... > <buildProviders> <add extension=".resx" appliesTo="Code,Resources" type="System.Web.Compilation.ResXBuildProvider"/> <add extension=".wsdl" appliesTo="Code" type="System.Web.Compilation.WsdlBuildProvider"/> <add extension=".xsd" appliesTo="Code" type="System.Web.Compilation.XsdBuildProvider"/> ... </buildProviders></compilation>

Components that autocompile files <buildProviders> config section

maps file types and directories to build providers



Code-Behind 2.0Code-Behind 2.0

<%@ Page CompileWith="Hello.aspx.cs" ClassName="MyPage_aspx" %>

<html> <body> <form runat="server"> <asp:TextBox ID="Input" RunAt="server" /> <asp:Button Text="Test" OnClick="OnTest"

RunAt="server" /> <asp:Label ID="Output" RunAt="server" /> </form> </body></html>

<%@ Page CompileWith="Hello.aspx.cs" ClassName="MyPage_aspx" %>

<html> <body> <form runat="server"> <asp:TextBox ID="Input" RunAt="server" /> <asp:Button Text="Test" OnClick="OnTest"

RunAt="server" /> <asp:Label ID="Output" RunAt="server" /> </form> </body></html>

Hello.aspx



Code-Behind 2.0, Code-Behind 2.0, Cont.Cont.

using System;

partial class MyPage_aspx{ void OnTest (Object sender, EventArgs e) { Output.Text = "Hello, " + Input.Text; }}

using System;

partial class MyPage_aspx{ void OnTest (Object sender, EventArgs e) { Output.Text = "Hello, " + Input.Text; }}

Hello.aspx.cs



PrecompilationPrecompilationPrecompile.axd

precompiles sites in place to avoid first-access delays



Deploying without Deploying without SourceSource

Aspnet_compiler.exe precompiles sites and deploys without source code

Dynamic Dynamic CompilationCompilationDynamic Dynamic CompilationCompilation




$ Expressions$ Expressions

<asp:SqlDataSource ID="Titles" RunAt="server" ConnectionString="<%$ ConnectionStrings:Pubs %>" SelectCommand="select title_id, title, price from titles" />

<asp:SqlDataSource ID="Titles" RunAt="server" ConnectionString="<%$ ConnectionStrings:Pubs %>" SelectCommand="select title_id, title, price from titles" />

<configuration> <connectionStrings> <add name="Pubs" connectionString="server=localhost;database=pubs;..." /> </connectionStrings></configuration>

<configuration> <connectionStrings> <add name="Pubs" connectionString="server=localhost;database=pubs;..." /> </connectionStrings></configuration>

ASPX

Web.config

Declarative mechanism for loading resources, connection strings, and more



Expression BuildersExpression Builders Components that evaluate $

expressions <expressionBuilders> config section

maps prefixes to expression builders<compilation ... > <expressionBuilders>

<add expressionPrefix="Resources" type="System.Web.Compilation.ResourceExpressionBuilder" />

<add expressionPrefix="ConnectionStrings" type="System.Web.Compilation.ConnectionStringsExpressionBuilder" />

<add expressionPrefix="AppSettings" type="System.Web.Compilation.AppSettingsExpressionBuilder" />

</expressionBuilders></compilation>

<compilation ... > <expressionBuilders>

<add expressionPrefix="Resources" type="System.Web.Compilation.ResourceExpressionBuilder" />

<add expressionPrefix="ConnectionStrings" type="System.Web.Compilation.ConnectionStringsExpressionBuilder" />

<add expressionPrefix="AppSettings" type="System.Web.Compilation.AppSettingsExpressionBuilder" />

</expressionBuilders></compilation>

Custom Custom Expression Expression BuildersBuilders

Custom Custom Expression Expression BuildersBuilders




Cross-Page PostingCross-Page Posting Pages can now post back to other pages

Relevant properties:control.PostBackUrl - Identifies postback

target

Page.PreviousPage - Returns reference to page that originated a cross-page postback

PreviousPage.IsCrossPagePostBack - Reveals whether a cross-page postback occurred

@ PreviousPageType directive provides strongly typed access to previous page



Posting Back to Posting Back to Another PageAnother Page

<html> <body> <form runat="server"> <asp:TextBox ID="Input" RunAt="server" /> <asp:Button Text="Test" PostBackUrl=

"PageTwo.aspx" RunAt="server" /> </form> </body></html>

<html> <body> <form runat="server"> <asp:TextBox ID="Input" RunAt="server" /> <asp:Button Text="Test" PostBackUrl=

"PageTwo.aspx" RunAt="server" /> </form> </body></html>



Referencing a Control on Referencing a Control on the Previous Page (Weak the Previous Page (Weak Typing)Typing)<html> <body> <asp:Label ID="Output" RunAt="server" /> </body></html>

<script language="C#" runat="server">void Page_Load (Object sender, EventArgs e){ if (PreviousPage != null && PreviousPage.IsCrossPagePostBack) { TextBox input = (TextBox) PreviousPage.FindControl ("Input"); Output.Text = "Hello, " + input.Text; }}</script>

<html> <body> <asp:Label ID="Output" RunAt="server" /> </body></html>

<script language="C#" runat="server">void Page_Load (Object sender, EventArgs e){ if (PreviousPage != null && PreviousPage.IsCrossPagePostBack) { TextBox input = (TextBox) PreviousPage.FindControl ("Input"); Output.Text = "Hello, " + input.Text; }}</script>



Referencing a Control on Referencing a Control on the Previous Page (Strong the Previous Page (Strong Typing)Typing)

<%@ PreviousPageType VirtualPath="~/PageOne.aspx" %>


<script language="C#" runat="server">void Page_Load (Object sender, EventArgs e){ if (PreviousPage != null && PreviousPage.IsCrossPagePostBack) Output.Text = "Hello, " + PreviousPage.InputBox.Text;}</script>

<%@ PreviousPageType VirtualPath="~/PageOne.aspx" %>


<script language="C#" runat="server">void Page_Load (Object sender, EventArgs e){ if (PreviousPage != null && PreviousPage.IsCrossPagePostBack) Output.Text = "Hello, " + PreviousPage.InputBox.Text;}</script>

Public property wrapping TextBox


Chalaivate.COM

Cross-Page Cross-Page PostbacksPostbacksCross-Page Cross-Page PostbacksPostbacks



Validation GroupsValidation Groups Validation controls can now be grouped

using new ValidationGroup property

Implemented by validation controlsAlso implemented by Button, LinkButton, and ImageButton controls

Allows page to post back when validators in target group are satisfied

Fixes deficiency in ASP.NET 1.x

Validation Validation GroupsGroupsValidation Validation GroupsGroups




Client CallbacksClient Callbacks "Lightweight" postbacks

Client-side callback manager transmits asynchronous XML-HTTP requests to server

Server receives and processes the request, but does not rerender the page

Callback manager receives the response and notifies the client via registered callback

Requires Internet Explorer 5.0 or higher

Great way to improve UI responsiveness



How Client How Client Callbacks WorkCallbacks Work

Client CallbackManager

PageClient initiates callback by calling function returned by GetCallback-EventReference

Callback manager launches async XML-HTTP call to server

Callback manager is notified that the call completed

Client is notified that the call completed and handed the result

Client Server

Page's RaiseCall-backEvent method is called

11 22

33

4455

Client Client CallbacksCallbacksClient Client CallbacksCallbacks




Who's Got the Focus?Who's Got the Focus? In ASP.NET 1.x, client-side script was

needed to assign focus to a control

In ASP.NET 2.0, use Page.SetFocus<asp:TextBox ID="UserName" RunAt="server" /> . . .<script language="C#" runat="server">void Page_Load (Object sender, EventArgs e){ SetFocus ("UserName");}</script>

<asp:TextBox ID="UserName" RunAt="server" /> . . .<script language="C#" runat="server">void Page_Load (Object sender, EventArgs e){ SetFocus ("UserName");}</script>



Panel.DefaultButtonPanel.DefaultButton Designates button to be "clicked"

when Enter is pressed with focus in panel

Work-around for the fact that ASP.NET limits pages to one runat="server" <form> each<asp:Panel DefaultButton="Button1" RunAt="server"> ... <asp:Button ID="Button1" ... /></asp:Panel><asp:Panel DefaultButton="Button2" RunAt="server"> ... <asp:Button ID="Button2" ... /></asp:Panel>

<asp:Panel DefaultButton="Button1" RunAt="server"> ... <asp:Button ID="Button1" ... /></asp:Panel><asp:Panel DefaultButton="Button2" RunAt="server"> ... <asp:Button ID="Button2" ... /></asp:Panel>



URL MappingURL Mapping Maps virtual URLs to physical URLs Great for declaratively

transforming physical pages into multiple logical pages

<urlMappings enabled="true"><add url="~/Home.aspx"mappedUrl="~/default.aspx?tabindex=0"/><add url="~/Forums.aspx"mappedUrl="~/default.aspx?tabindex=1"/><add url="~/Faq.aspx"mappedUrl="~/default.aspx?tabindex=2"/></urlMappings>

<urlMappings enabled="true"><add url="~/Home.aspx"mappedUrl="~/default.aspx?tabindex=0"/><add url="~/Forums.aspx"mappedUrl="~/default.aspx?tabindex=1"/><add url="~/Faq.aspx"mappedUrl="~/default.aspx?tabindex=2"/></urlMappings>

Virtual URLPhysical URL



Machine.configMachine.config Default settings "baked in" to system

Reduces size of Machine.configImproves application startup performance

New Machine.config-related files:Machine.config.defaults - Documents default

settings baked into the run-timeMachine.config.comments - Documents syntax

of config elements, many of which are newSame directory as Machine.config



Using Visual Studio Using Visual Studio 2005 to Build Data-2005 to Build Data-Driven ASP.NET 2.0 Driven ASP.NET 2.0 ApplicationsApplications

Using Visual Studio Using Visual Studio 2005 to Build Data-2005 to Build Data-Driven ASP.NET 2.0 Driven ASP.NET 2.0 ApplicationsApplications




AgendaAgendaSimplified data bindingData source controlsData controls

GridView and DetailsView controlsEditing with GridView and DetailsView

CachingSQL cache dependenciesCache configuration



Simplified Data Simplified Data BindingBinding

Data binding expressions are now simpler and support hierarchical (XML) data binding

<%# DataBinder.Eval (Container.DataItem, "Price") %>

<%# Eval ("Price") %>

<%# XPath ("Price") %>

<%# DataBinder.Eval (Container.DataItem, "Price") %>

<%# Eval ("Price") %>

<%# XPath ("Price") %>



DataSource DataSource ControlsControls

NameName DescriptionDescription

SqlDataSourceSqlDataSource Connects data-binding controls to SQL databasesConnects data-binding controls to SQL databases

AccessDataSourceAccessDataSource Connects data-binding controls to Access databasesConnects data-binding controls to Access databases

XmlDataSourceXmlDataSource Connects data-binding controls to XML dataConnects data-binding controls to XML data

ObjectDataSourceObjectDataSource Connects data-binding controls to data componentsConnects data-binding controls to data components

SiteMapDataSourceSiteMapDataSource Connects site navigation controls to site map dataConnects site navigation controls to site map data

Declarative (no-code) data binding



SqlDataSourceSqlDataSource Declarative data binding to SQL databases

Any database served by a managed provider

Two-way data binding

SelectCommand defines query semanticsInsertCommand, UpdateCommand, and

DeleteCommand define update semantics

Optional caching of query results

Parameterized operation



Using Using SqlDataSourceSqlDataSource

<asp:SqlDataSource ID="Titles" RunAt="server“

ConnectionString="server=localhost; database=pubs;integrated security=true" SelectCommand="select title_id, title, price from titles" />

<asp:DataGrid DataSourceID="Titles" RunAt="server" />

<asp:SqlDataSource ID="Titles" RunAt="server“

ConnectionString="server=localhost; database=pubs;integrated security=true" SelectCommand="select title_id, title, price from titles" />

<asp:DataGrid DataSourceID="Titles" RunAt="server" />



Key SqlDataSource Key SqlDataSource PropertiesProperties


ConnectionStringConnectionString Connection string used to connect to data sourceConnection string used to connect to data source

SelectCommandSelectCommand Command used to perform queriesCommand used to perform queries

InsertCommandInsertCommand Command used to perform insertsCommand used to perform inserts

UpdateCommandUpdateCommand Command used to perform updatesCommand used to perform updates

DeleteCommandDeleteCommand Command used to perform deletesCommand used to perform deletes

DataSourceModeDataSourceMode Specifies whether DataSet or DataReader is used(default = DataSet)

Specifies whether DataSet or DataReader is used(default = DataSet)

ProviderNameProviderName Specifies provider (default = SQL Server .NET provider)Specifies provider (default = SQL Server .NET provider)



Using an Oracle Using an Oracle DatabaseDatabase

<asp:SqlDataSource ID="Titles" RunAt="server" ConnectionString="..." SelectCommand="select title_id, title, price from titles" ProviderName="System.Data.OracleClient" />

<asp:SqlDataSource ID="Titles" RunAt="server" ConnectionString="..." SelectCommand="select title_id, title, price from titles" ProviderName="System.Data.OracleClient" />



SqlDataSource and SqlDataSource and CachingCaching

SqlDataSource supports declarative caching of results through these properties:NameName DescriptionDescription

EnableCachingEnableCaching Specifies whether caching is enabled (default = false)Specifies whether caching is enabled (default = false)

CacheDurationCacheDuration Length of time in seconds results should be cachedLength of time in seconds results should be cached

CacheExpirationPolicyCacheExpirationPolicySpecifies whether cache duration is sliding or absoluteSpecifies whether cache duration is sliding or absolute

CacheKeyDependencyCacheKeyDependencyCreates dependency on specified cache keyCreates dependency on specified cache key

SqlCacheDependencySqlCacheDependencyCreates dependency on specified database entityCreates dependency on specified database entity



<asp:SqlDataSource ID="Countries" RunAt="server"ConnectionString="server=localhost;database=northwind;..."SelectCommand="select distinct country from customers order by country"EnableCaching="true" CacheDuration="60" /><asp:DropDownList ID="MyDropDownList" DataSourceID="Countries"DataTextField="country" AutoPostBack="true" RunAt="server" />

<asp:SqlDataSource ID="Countries" RunAt="server"ConnectionString="server=localhost;database=northwind;..."SelectCommand="select distinct country from customers order by country"EnableCaching="true" CacheDuration="60" /><asp:DropDownList ID="MyDropDownList" DataSourceID="Countries"DataTextField="country" AutoPostBack="true" RunAt="server" />

Caching Query Caching Query ResultsResults



Parameterized Parameterized CommandsCommands

XxxParameters properties permit database commands to be parameterized

Example: Get value for WHERE clause in SelectCommand from query string parameter or item selected in drop-down list

Example: Get value for WHERE clause in DeleteCommand from GridView

XxxParameter types specify source of parameter values



XxxParameters XxxParameters PropertiesProperties


SelectParametersSelectParameters Specifies parameters for SelectCommand Specifies parameters for SelectCommand

InsertParametersInsertParameters

UpdateParametersUpdateParameters

DeleteParametersDeleteParameters

FilterParametersFilterParameters Specifies parameters for FilterExpressionSpecifies parameters for FilterExpression

Specifies parameters for InsertCommand Specifies parameters for InsertCommand

Specifies parameters for UpdateCommand Specifies parameters for UpdateCommand

Specifies parameters for DeleteCommand Specifies parameters for DeleteCommand



XxxParameter XxxParameter TypesTypes


ControlParameterControlParameter Binds a replaceable parameter to a control propertyBinds a replaceable parameter to a control property

CookieParameterCookieParameter Binds a replaceable parameter to a cookie valueBinds a replaceable parameter to a cookie value

FormParameterFormParameter Binds a replaceable parameter to a form fieldBinds a replaceable parameter to a form field

QueryStringParameterQueryStringParameterBinds a replaceable parameter to a query string parameterBinds a replaceable parameter to a query string parameter

SessionParameterSessionParameter Binds a replaceable parameter to a session variableBinds a replaceable parameter to a session variable

ParameterParameter Binds a replaceable parameter to a data fieldBinds a replaceable parameter to a data field



Using Using ControlParameteControlParameterr <asp:SqlDataSource ID="Countries" RunAt="server"

ConnectionString="server=localhost;database=northwind;..." SelectCommand="select distinct country from customers order by country" /><asp:SqlDataSource ID="Customers" RunAt="server" ConnectionString="server=localhost;database=northwind;..." SelectCommand="select * from customers where country=@Country"> <SelectParameters> <asp:ControlParameter Name="Country" ControlID="MyDropDownList" PropertyName="SelectedValue" /> </SelectParameters></asp:SqlDataSource><asp:DropDownList ID="MyDropDownList" DataSourceID="Countries" DataTextField="country" AutoPostBack="true" RunAt="server" /><asp:DataGrid DataSourceID="Customers" RunAt="server" />

<asp:SqlDataSource ID="Countries" RunAt="server" ConnectionString="server=localhost;database=northwind;..." SelectCommand="select distinct country from customers order by country" /><asp:SqlDataSource ID="Customers" RunAt="server" ConnectionString="server=localhost;database=northwind;..." SelectCommand="select * from customers where country=@Country"> <SelectParameters> <asp:ControlParameter Name="Country" ControlID="MyDropDownList" PropertyName="SelectedValue" /> </SelectParameters></asp:SqlDataSource><asp:DropDownList ID="MyDropDownList" DataSourceID="Countries" DataTextField="country" AutoPostBack="true" RunAt="server" /><asp:DataGrid DataSourceID="Customers" RunAt="server" />



Calling Stored Calling Stored ProceduresProcedures

<asp:SqlDataSource ID="Countries" RunAt="server" ConnectionString="server=localhost;database=northwind;..." SelectCommand="proc_GetCountries" /><asp:SqlDataSource ID="Customers" RunAt="server" ConnectionString="server=localhost;database=northwind;..." SelectCommand="proc_GetCustomers"> <SelectParameters> <asp:ControlParameter Name="Country" ControlID="MyDropDownList" PropertyName="SelectedValue" /> </SelectParameters></asp:SqlDataSource><asp:DropDownList ID="MyDropDownList" DataSourceID="Countries" DataTextField="country" AutoPostBack="true" RunAt="server" /><asp:DataGrid DataSourceID="Customers" RunAt="server" />

<asp:SqlDataSource ID="Countries" RunAt="server" ConnectionString="server=localhost;database=northwind;..." SelectCommand="proc_GetCountries" /><asp:SqlDataSource ID="Customers" RunAt="server" ConnectionString="server=localhost;database=northwind;..." SelectCommand="proc_GetCustomers"> <SelectParameters> <asp:ControlParameter Name="Country" ControlID="MyDropDownList" PropertyName="SelectedValue" /> </SelectParameters></asp:SqlDataSource><asp:DropDownList ID="MyDropDownList" DataSourceID="Countries" DataTextField="country" AutoPostBack="true" RunAt="server" /><asp:DataGrid DataSourceID="Customers" RunAt="server" />

CREATE PROCEDURE proc_GetCustomers@Country nvarchar (32) AS SELECT * FROM Customers WHERE Country = @CountryGO

CREATE PROCEDURE proc_GetCustomers@Country nvarchar (32) AS SELECT * FROM Customers WHERE Country = @CountryGO

CREATE PROCEDURE proc_GetCountries AS SELECT DISTINCT Country FROM Customers ORDER BY CountryGO

CREATE PROCEDURE proc_GetCountries AS SELECT DISTINCT Country FROM Customers ORDER BY CountryGO

SqlDataSourSqlDataSourceceSqlDataSourSqlDataSourcece




XmlDataSourceXmlDataSourceDeclarative data binding to XML

dataSupports caching and XSL

transformationsOne-way data binding only; no

updating

<asp:XmlDataSource ID="Rates" DataFile="Rates.xml" RunAt="server" />

<asp:TreeView ID="MyTreeView" DataSourceID="Rates" RunAt="server" />

<asp:XmlDataSource ID="Rates" DataFile="Rates.xml" RunAt="server" />

<asp:TreeView ID="MyTreeView" DataSourceID="Rates" RunAt="server" />



Key XmlDataSource Key XmlDataSource PropertiesProperties


DataFileDataFile Path to file containing XML dataPath to file containing XML data

TransformFileTransformFile Path to file containing XSL style sheetPath to file containing XSL style sheet

EnableCachingEnableCaching

XPathXPath XPath expression used to filter dataXPath expression used to filter data

CacheDurationCacheDuration Length of time in seconds data should be cachedLength of time in seconds data should be cached

CacheExpirationPolicyCacheExpirationPolicy Specifies whether cache duration is sliding or absoluteSpecifies whether cache duration is sliding or absolute

CacheKeyDependencyCacheKeyDependencyCreates dependency on specified cache keyCreates dependency on specified cache key

Specifies whether caching is enabled (default = false)Specifies whether caching is enabled (default = false)



ObjectDataSourceObjectDataSourceDeclarative binding to data components

Leverage middle-tier data access components

Keep data access code separate from UI layer

Two-way data bindingSelectMethod, InsertMethod,

UpdateMethod, and DeleteMethod

Optional caching of query results

Parameterized operation



Key ODS PropertiesKey ODS Properties


TypeNameTypeName Type name of data componentType name of data component

SelectMethodSelectMethod Method called on data component to perform queriesMethod called on data component to perform queries

InsertMethodInsertMethod

UpdateMethodUpdateMethod

DeleteMethodDeleteMethod

EnableCachingEnableCaching Specifies whether caching is enabled (default = false)Specifies whether caching is enabled (default = false)

Method called on data component to perform insertsMethod called on data component to perform inserts

Method called on data component to perform updates

Method called on data component to perform deletesMethod called on data component to perform deletes



Key ODS Key ODS Properties, Cont.Properties, Cont.


InsertParametersInsertParameters Specifies parameters for InsertMethodSpecifies parameters for InsertMethod

UpdateParametersUpdateParameters Specifies parameters for UpdateMethodSpecifies parameters for UpdateMethod

DeleteParametersDeleteParameters Specifies parameters for DeleteMethodSpecifies parameters for DeleteMethod

SelectParametersSelectParameters Specifies parameters for SelectMethodSpecifies parameters for SelectMethod

CacheDurationCacheDuration Length of time in seconds data should be cachedLength of time in seconds data should be cached

SqlCacheDependencySqlCacheDependency Creates dependency on specified database entityCreates dependency on specified database entity



Initialization and Initialization and Clean-UpClean-Up

ObjectDataSource.SelectMethod et al can identify static methods or instance methods

If instance methods are used:ODS creates new class instance on each

callClass must have public default constructor

Use ObjectCreated and ObjectDisposing events to perform specialized initialization or clean-up work on data components

ObjectDataSObjectDataSourceourceObjectDataSObjectDataSourceource




The GridView The GridView ControlControlEnhanced DataGrid control

Renders sets of records as HTML tables

Built-in sorting, paging, selecting, updating, and deleting support

Supports rich assortment of field types, including ImageFields and CheckBoxFieldsDeclared in <Columns> element

Highly customizable UI



GridView GridView ExampleExample

<asp:SqlDataSource ID="Employees" RunAt="server“

ConnectionString="server=localhost;database=northwind;...“

SelectCommand="select lastname, firstname, title from employees" />

<asp:GridView DataSourceID="Employees" Width="100%" RunAt="server" />

<asp:SqlDataSource ID="Employees" RunAt="server“

ConnectionString="server=localhost;database=northwind;...“

SelectCommand="select lastname, firstname, title from employees" />

<asp:GridView DataSourceID="Employees" Width="100%" RunAt="server" />



OutputOutput



GridView Field TypesGridView Field Types


BoundFieldBoundField Renders columns of text from fields in data sourceRenders columns of text from fields in data source

ButtonFieldButtonField Renders columns of buttons (push button, image, or link)Renders columns of buttons (push button, image, or link)

CheckBoxFieldCheckBoxField Renders Booleans as check boxesRenders Booleans as check boxes

HyperLinkFieldHyperLinkField Renders columns of hyperlinksRenders columns of hyperlinks

TemplateFieldTemplateField Renders columns using HTML templatesRenders columns using HTML templates

CommandFieldCommandField Renders controls for selecting and editing GridView dataRenders controls for selecting and editing GridView data

ImageFieldImageField Renders columns of imagesRenders columns of images



Specifying Field TypesSpecifying Field Types<asp:SqlDataSource ID="Employees" RunAt="server" ConnectionString="server=localhost;database=northwind;...“

SelectCommand="select photo, lastname, firstname, title from employees" />

<asp:GridView DataSourceID="Employees" Width="100%“ RunAt="server" AutoGenerateColumns="false" > <Columns> <asp:ImageField HeaderText="" DataField="photo" /> <asp:TemplateField HeaderText="Name"> <ItemTemplate> <%# Eval ("firstname") + " " + Eval ("lastname") %> </ItemTemplate> </asp:TemplateField> <asp:BoundField HeaderText="Title" DataField="title" /> </Columns></asp:GridView>

<asp:SqlDataSource ID="Employees" RunAt="server" ConnectionString="server=localhost;database=northwind;...“

SelectCommand="select photo, lastname, firstname, title from employees" />

<asp:GridView DataSourceID="Employees" Width="100%“ RunAt="server" AutoGenerateColumns="false" > <Columns> <asp:ImageField HeaderText="" DataField="photo" /> <asp:TemplateField HeaderText="Name"> <ItemTemplate> <%# Eval ("firstname") + " " + Eval ("lastname") %> </ItemTemplate> </asp:TemplateField> <asp:BoundField HeaderText="Title" DataField="title" /> </Columns></asp:GridView>



OutputOutput



The DetailsView The DetailsView ControlControl

Renders individual recordsPair with GridView for master-detail views

Or use without GridView to display individual records

Built-in paging, inserting, updating, deleting

Uses same field types as GridViewDeclared in <Fields> element

Highly customizable UI



DetailsView ExampleDetailsView Example<asp:SqlDataSource ID="Employees" RunAt="server" ConnectionString="server=localhost;database=northwind;..." SelectCommand="select employeeid, photo, ... from employees" /><asp:DetailsView DataSourceID="Employees" RunAt="server" AllowPaging="true" AutoGenerateRows="false" PagerSettings-Mode="NextPreviousFirstLast"> <Fields> <asp:ImageField HeaderText="" DataField="photo" /> <asp:BoundField HeaderText="Employee ID" DataField="employeeid" /> <asp:BoundField HeaderText="Date Hired" DataField="hiredate" /> <asp:TemplateField HeaderText="Name"> <ItemTemplate> <%# Eval ("firstname") + " " + Eval ("lastname") %> </ItemTemplate> </asp:TemplateField> <asp:BoundField HeaderText="Title" DataField="title" /> </Fields></asp:DetailsView>

<asp:SqlDataSource ID="Employees" RunAt="server" ConnectionString="server=localhost;database=northwind;..." SelectCommand="select employeeid, photo, ... from employees" /><asp:DetailsView DataSourceID="Employees" RunAt="server" AllowPaging="true" AutoGenerateRows="false" PagerSettings-Mode="NextPreviousFirstLast"> <Fields> <asp:ImageField HeaderText="" DataField="photo" /> <asp:BoundField HeaderText="Employee ID" DataField="employeeid" /> <asp:BoundField HeaderText="Date Hired" DataField="hiredate" /> <asp:TemplateField HeaderText="Name"> <ItemTemplate> <%# Eval ("firstname") + " " + Eval ("lastname") %> </ItemTemplate> </asp:TemplateField> <asp:BoundField HeaderText="Title" DataField="title" /> </Fields></asp:DetailsView>



OutputOutput

Master-Master-Detail ViewsDetail ViewsMaster-Master-Detail ViewsDetail Views




Inserting, Inserting, Updating, and Updating, and DeletingDeletingData controls supply editing UIs

AutoGenerateXxxButton propertiesInsert/EditRowStyle properties

Data source controls supply editing logicInsert/Update/DeleteCommand propertiesInsert/Update/DeleteParameters properties

Inserting/ed, Updating/ed, Deleting/ed events

Visual Studio supplies the glue



Editing with GridViewsEditing with GridViews


SelectCommand="select employeeid, lastname, firstname, from employees“

UpdateCommand="update employees set lastname=@lastname, firstname=

@firstname where employeeid=@original_employeeid"> <UpdateParameters> <asp:Parameter Name="EmployeeID" Type="Int32" /> <asp:Parameter Name="lastname" Type="String" /> <asp:Parameter Name="firstname" Type="String" /> </UpdateParameters></asp:SqlDataSource>

<asp:GridView DataSourceID="Employees" Width="100%" RunAt="server" DataKeyNames="EmployeeID" AutoGenerateEditButton="true" />


SelectCommand="select employeeid, lastname, firstname, from employees“

UpdateCommand="update employees set lastname=@lastname, firstname=

@firstname where employeeid=@original_employeeid"> <UpdateParameters> <asp:Parameter Name="EmployeeID" Type="Int32" /> <asp:Parameter Name="lastname" Type="String" /> <asp:Parameter Name="firstname" Type="String" /> </UpdateParameters></asp:SqlDataSource>


Edit buttonsPrimary key

Update commandUpdate parameters



Conflict DetectionConflict Detection First-in wins

Update fails if data has changedStructure UpdateCommand accordinglySet ConflictDetection="CompareAllValues“

Last-in winsUpdate succeeds even if data has changedStructure UpdateCommand accordinglySet ConflictDetection="OverwriteChanges"



First-In-Wins UpdatesFirst-In-Wins Updates<asp:SqlDataSource ID="Employees" RunAt="server"ConnectionString="server=localhost;database=northwind;..." SelectCommand="select employeeid, lastname, firstname, from employees“

UpdateCommand="update employees set lastname=@lastname, firstname = @firstname where employeeid=@original_employeeid and lastname = @original_lastname and firstname=@original_firstname" ConflictDetection="CompareAllValues">

<UpdateParameters> <asp:Parameter Name="EmployeeID" Type="Int32" /> <asp:Parameter Name="lastname" Type="String" /> <asp:Parameter Name="firstname" Type="String" /></UpdateParameters></asp:SqlDataSource>


<asp:SqlDataSource ID="Employees" RunAt="server"ConnectionString="server=localhost;database=northwind;..." SelectCommand="select employeeid, lastname, firstname, from employees“

UpdateCommand="update employees set lastname=@lastname, firstname = @firstname where employeeid=@original_employeeid and lastname = @original_lastname and firstname=@original_firstname" ConflictDetection="CompareAllValues">

<UpdateParameters> <asp:Parameter Name="EmployeeID" Type="Int32" /> <asp:Parameter Name="lastname" Type="String" /> <asp:Parameter Name="firstname" Type="String" /></UpdateParameters></asp:SqlDataSource>




Error DetectionError DetectionControls fire events after database updates

GridView.RowUpdatedDetailsView.ItemUpdatedSqlDataSource.Updated, etc.

Event handlers receive "status" objectsReveal whether database exception occurred

Allow exceptions to be handled or rethrownReveal how many rows were affected



Handling Update Handling Update ErrorsErrors<asp:SqlDataSource ID="Employees" RunAt="server" ... UpdateCommand="..." OnUpdated="OnUpdateComplete"> ...</asp:SqlDataSource> ...void OnUpdateComplete (Object source, SqlDataDataSourceStatusEventsArgs e){ if (e.Exception != null) { // Exception thrown. Set e.ExceptionHandled to true to prevent // the SqlDataSource from throwing an exception, or leave it set // to false to allow SqlDataSource to rethrow the exception }

else if (e.AffectedRows == 0) { // No exception was thrown, but no records were updated, either. // Might want to let the user know that the update failed }}

<asp:SqlDataSource ID="Employees" RunAt="server" ... UpdateCommand="..." OnUpdated="OnUpdateComplete"> ...</asp:SqlDataSource> ...void OnUpdateComplete (Object source, SqlDataDataSourceStatusEventsArgs e){ if (e.Exception != null) { // Exception thrown. Set e.ExceptionHandled to true to prevent // the SqlDataSource from throwing an exception, or leave it set // to false to allow SqlDataSource to rethrow the exception }

else if (e.AffectedRows == 0) { // No exception was thrown, but no records were updated, either. // Might want to let the user know that the update failed }}

Editing with Editing with GridViews GridViews and and DetailsViewsDetailsViews

Editing with Editing with GridViews GridViews and and DetailsViewsDetailsViews




SQL Cache SQL Cache DependenciesDependencies

New cache dependency typeEmbodied in SqlCacheDependency

classConfigured through

<sqlCacheDependency> configuration section

Links cached items to database entitiesASP.NET application cacheASP.NET output cache

Compatible with SQL Server 7, 2000, 2005



Preparing a Preparing a DatabaseDatabase

Use Aspnet_regsql.exe or SqlCache-DependencyAdmin to prepare database*

aspnet_regsql -S localhost -E -d Northwind -edaspnet_regsql -S localhost -E -d Northwind -ed

Trusted connection

Database name

Enable database

* Not necessary for SQL Server 2005

Server name



Preparing a TablePreparing a Table Use Aspnet_regsql.exe or

SqlCache-DependencyAdmin to prepare table*

aspnet_regsql -S localhost -E -d Northwind -t Products -etaspnet_regsql -S localhost -E -d Northwind -t Products -et

Trusted connection

Database name

Table name

Server name

Enable table

* Not necessary for SQL Server 2005



Preparing Web.configPreparing Web.config<configuration> <connectionStrings> <add name="Northwind“

connectionString="server=localhost;database=northwind;..." />

</connectionStrings> <system.web> <caching> <sqlCacheDependency enabled="true" pollTime="5000"> <databases>

<add name="Northwind" connectionStringName="Northwind" />

</databases> </sqlCacheDependency> </caching> <system.web></configuration>

<configuration> <connectionStrings> <add name="Northwind“

connectionString="server=localhost;database=northwind;..." />

</connectionStrings> <system.web> <caching> <sqlCacheDependency enabled="true" pollTime="5000"> <databases>

<add name="Northwind" connectionStringName="Northwind" />

</databases> </sqlCacheDependency> </caching> <system.web></configuration>



Using Using SqlCacheDependencSqlCacheDependency with the y with the Application CacheApplication Cache

Cache.Insert ("Products", products, new SqlCacheDependency ("Northwind", "Products");

Cache.Insert ("Products", products, new SqlCacheDependency ("Northwind", "Products");

Database name

Table name



Using Using SqlCacheDependencSqlCacheDependency with the Output y with the Output CacheCache<%@ OutputCache Duration="60" VaryByParam="None"

SqlDependency="Northwind:Products" %><%@ OutputCache Duration="60" VaryByParam="None" SqlDependency="Northwind:Products" %>

Database name

Table name



Using Using SqlCacheDependency SqlCacheDependency with SqlDataSourcewith SqlDataSource<asp:SqlDataSource ID="Countries" RunAt="server"ConnectionString="server=localhost;database=northwind;...“

SelectCommand="select distinct country from customers order by country“

EnableCaching="true" CacheDuration="60000"SqlCacheDependency="Northwind:Customers" /><asp:DropDownList ID="MyDropDownList" DataSourceID="Countries"DataTextField="country" AutoPostBack="true" RunAt="server" />

<asp:SqlDataSource ID="Countries" RunAt="server"ConnectionString="server=localhost;database=northwind;...“

SelectCommand="select distinct country from customers order by country“

EnableCaching="true" CacheDuration="60000"SqlCacheDependency="Northwind:Customers" /><asp:DropDownList ID="MyDropDownList" DataSourceID="Countries"DataTextField="country" AutoPostBack="true" RunAt="server" />

Database name

Table name



Cache Cache ConfigurationConfiguration <cache>

Enable/disable application cacheEnable/disable item expiration and

more

<outputCache>, <outputCacheSettings>Enable/disable output cachingEnable/disable disk-based persistenceSet maximum size per app and more

<sqlCacheDependency>

SQL Cache SQL Cache DependencieDependenciess

SQL Cache SQL Cache DependencieDependenciess




Managing Managing Look, Feel, and Look, Feel, and Layout with Layout with Visual Studio Visual Studio 2005 and 2005 and ASP.NET 2.0ASP.NET 2.0

Managing Managing Look, Feel, and Look, Feel, and Layout with Layout with Visual Studio Visual Studio 2005 and 2005 and ASP.NET 2.0ASP.NET 2.0




AgendaAgenda Master pages

Master pages and content pagesAccessing controls defined in master pages

Themes and skinsApplying themesGlobal themes vs. local themesTheme and skin definitions

New controls



Master PagesMaster PagesMaster Page

Content Page



Master Page Master Page BasicsBasics

Masters define common content and placeholders (<asp:ContentPlaceHolder>)

Content pages reference masters and fill placeholders with content (<asp:Content>)<%@ Master %>

<asp:ContentPlaceHolder ID="Main" RunAt="server" />

<%@ Master %>

<asp:ContentPlaceHolder ID="Main" RunAt="server" />

<%@ Page MasterPage- File="Site.master" %>

<asp:Content ContentPlaceHolderID= "Main" RunAt="server" />

</asp:Content>

<%@ Page MasterPage- File="Site.master" %>

<asp:Content ContentPlaceHolderID= "Main" RunAt="server" />

</asp:Content>

Site.master default.aspx http://.../default.aspx



Defining a Master Defining a Master PagePage<%@ Master %>

<html> <body>  <table width="100%"> <tr> <td bgcolor="darkblue" align="center"> <span style="font-size: 36pt; color: white">

ACME Inc.</span> </td> </tr> </table>

 <asp:ContentPlaceHolder ID="Main" RunAt="server" /> </body></html>

<%@ Master %>

<html> <body>  <table width="100%"> <tr> <td bgcolor="darkblue" align="center"> <span style="font-size: 36pt; color: white">

ACME Inc.</span> </td> </tr> </table>

 <asp:ContentPlaceHolder ID="Main" RunAt="server" /> </body></html>



Applying a Master Applying a Master PagePage

<%@ Page MasterPageFile="~/Site.master" %>

<asp:Content ContentPlaceHolderID="Main" RunAt="server"> This content fills the place holder "Main"

defined in the master page</asp:Content>

<%@ Page MasterPageFile="~/Site.master" %>

<asp:Content ContentPlaceHolderID="Main" RunAt="server"> This content fills the place holder "Main"

defined in the master page</asp:Content>



Applying a Master Page Applying a Master Page to a Siteto a Site

<configuration> <system.web> <pages masterPageFile="~/Site.master" /> </system.web></configuration>

<configuration> <system.web> <pages masterPageFile="~/Site.master" /> </system.web></configuration>



Applying a Master Applying a Master Page Page ProgrammaticallyProgrammaticallyvoid Page_PreInit (Object sender, EventArgs e){ Page.MasterPageFile = "~/Site.master";}

void Page_PreInit (Object sender, EventArgs e){ Page.MasterPageFile = "~/Site.master";}



Default ContentDefault Content ContentPlaceHolder controls can

define content of their own ("default content")

Default content is displayed ONLY if not overridden by content page<%@ Master %>

...<asp:ContentPlaceHolder ID="Main" RunAt="server">

This is default content that will appear in the absence of amatching Content control in a content page

<asp:ContentPlaceHolder>

<%@ Master %> ...<asp:ContentPlaceHolder ID="Main" RunAt="server">

This is default content that will appear in the absence of amatching Content control in a content page

<asp:ContentPlaceHolder>



The Page.Master The Page.Master PropertyProperty

Retrieves reference to master pageInstance of class derived from

System.Web.UI.MasterPageNull if page doesn't have a master

Used to programmatically access content defined in the master pageUse FindControl for weak typingUse public property in master page

for strong typing (preferred)



Accessing a Control in Accessing a Control in the Master Page the Master Page (Weak Typing)(Weak Typing)

((Label) Master.FindControl ("Title")).Text = "Orders";((Label) Master.FindControl ("Title")).Text = "Orders";

In the content page…

<asp:Label ID="Title" RunAt="server" /><asp:Label ID="Title" RunAt="server" />

In the master page…



Accessing a Control in Accessing a Control in the Master Page the Master Page (Strong Typing)(Strong Typing)

Master.TitleText = "Orders";Master.TitleText = "Orders";

In the content page…

<asp:Label ID="Title" RunAt="server" /> . . .<script language="C#" runat="server">public string TitleText{ get { return Title.Text; } set { Title.Text = value; }}</script>

<asp:Label ID="Title" RunAt="server" /> . . .<script language="C#" runat="server">public string TitleText{ get { return Title.Text; } set { Title.Text = value; }}</script>

In the master page…



Nesting Master Nesting Master PagesPages

Master pages can be nested Master pages that have masters

must contain only Content controls, but Content controls can contain ContentPlaceHolders

<%@ Master MasterPageFile="~/Site.Master" %>

<asp:Content ContentPlaceHolderID="..." RunAt="server"> <asp:ContentPlaceHolder ID="..." RunAt="server"> ... </asp:ContentPlaceHolder><asp:Content>

<%@ Master MasterPageFile="~/Site.Master" %>

<asp:Content ContentPlaceHolderID="..." RunAt="server"> <asp:ContentPlaceHolder ID="..." RunAt="server"> ... </asp:ContentPlaceHolder><asp:Content>

Master Master PagesPagesMaster Master PagesPages




Themes and SkinsThemes and Skins Mechanism for theming controls, pages,

and sites by group-initializing control properties

Skin = Visual attributes for control(s)Physically stored in .skin filesDefault skins and named skins

Theme = Collection of one or more skinsPhysically stored in Themes subfoldersGlobal themes and local themes



Applying a Theme to Applying a Theme to a Pagea Page

<%@ Page Theme="BasicBlue"><%@ Page Theme="BasicBlue">

Before After



Applying a Theme to Applying a Theme to a Sitea Site

<configuration> <system.web> <pages theme="BasicBlue" /> </system.web></configuration>

<configuration> <system.web> <pages theme="BasicBlue" /> </system.web></configuration>



Applying a Theme Applying a Theme ProgrammaticallyProgrammaticallyvoid Page_PreInit (Object sender, EventArgs e){ Page.Theme = "BasicBlue";}

void Page_PreInit (Object sender, EventArgs e){ Page.Theme = "BasicBlue";}



Global ThemesGlobal Themes

Themes

BasicBlue

Smoke-AndGlass

SKIN

SKIN

SKIN

SKIN

ASP.NET-ClientFil

es Theme name =Subdirectory name



Local ThemesLocal Themes

Themes

Shocking-Pink

Autumn-Leaves

SKIN

SKIN

SKIN

SKIN

vroot

Theme name =Subdirectory name

Theme name =Subdirectory name



Defining SkinsDefining Skins<asp:DropDownList runat="server" BackColor="hotpink" ForeColor="white" />



<asp:DataGrid runat="server" BackColor="#CCCCCC" BorderWidth="2pt“

BorderStyle="Solid" BorderColor="#CCCCCC" GridLines="Vertical“

HorizontalAlign="Left"> <HeaderStyle ForeColor="white" BackColor="hotpink" /> <ItemStyle ForeColor="black" BackColor="white" /> <AlternatingItemStyle BackColor="pink" ForeColor="black" /></asp:DataGrid>

...

<asp:DropDownList runat="server" BackColor="hotpink" ForeColor="white" />



<asp:DataGrid runat="server" BackColor="#CCCCCC" BorderWidth="2pt“

BorderStyle="Solid" BorderColor="#CCCCCC" GridLines="Vertical“

HorizontalAlign="Left"> <HeaderStyle ForeColor="white" BackColor="hotpink" /> <ItemStyle ForeColor="black" BackColor="white" /> <AlternatingItemStyle BackColor="pink" ForeColor="black" /></asp:DataGrid>

...



Named SkinsNamed Skins Skins without SkinIDs are default skins

Skins with SkinIDs are named skinsSkinIDs must be unique per control type

Can be defined in same SKIN file as default skins or in separate files

Use controls' SkinID properties to apply named skins



Defining Named Defining Named SkinsSkins

<asp:DropDownList runat="server" BackColor="blue" ForeColor="white" SkinID="Blue" />

<asp:DataGrid runat="server" BackColor="#CCCCCC" BorderWidth="2pt" BorderStyle="Solid" BorderColor="#CCCCCC" GridLines="Vertical"HorizontalAlign="Left" SkinID="Blue">

<HeaderStyle ForeColor="white" BackColor="blue" /> <ItemStyle ForeColor="black" BackColor="white" /> <AlternatingItemStyle BackColor="lightblue"

ForeColor="black" /></asp:DataGrid>

...

<asp:DropDownList runat="server" BackColor="blue" ForeColor="white" SkinID="Blue" />

<asp:DataGrid runat="server" BackColor="#CCCCCC" BorderWidth="2pt" BorderStyle="Solid" BorderColor="#CCCCCC" GridLines="Vertical"HorizontalAlign="Left" SkinID="Blue">

<HeaderStyle ForeColor="white" BackColor="blue" /> <ItemStyle ForeColor="black" BackColor="white" /> <AlternatingItemStyle BackColor="lightblue"

ForeColor="black" /></asp:DataGrid>

...



Using a Named SkinUsing a Named Skin

<asp:DropDownList ID="Countries" SkinID="Blue" RunAt="server" /><asp:DropDownList ID="Countries" SkinID="Blue" RunAt="server" />



The The EnableTheming EnableTheming PropertyProperty Supported by all pages and controls

Defaults to true Set EnableTheming to false to disable

theming for individual controls or entire pages

<asp:DropDownList ID="Countries" EnableTheming="false" RunAt="server" /><asp:DropDownList ID="Countries" EnableTheming="false" RunAt="server" />

Themes and Themes and SkinsSkinsThemes and Themes and SkinsSkins




ASP.NET 2.0 contains ~50 new controls

New ControlsNew Controls

CategoryCategory ControlsControls

Data controlsData controls GridView and DetailsViewGridView and DetailsView

Data source controlsData source controls SqlDataSource, ObjectDataSource, XmlDataSource, etc.SqlDataSource, ObjectDataSource, XmlDataSource, etc.

Login controlsLogin controls Login, CreateUserWizard, PasswordRecovery, etc.Login, CreateUserWizard, PasswordRecovery, etc.

Navigation controlsNavigation controls Menu, TreeView, and SiteMapPathMenu, TreeView, and SiteMapPath

Web Parts controlsWeb Parts controls WebPartManager, WebPartZone, etc.WebPartManager, WebPartZone, etc.

UI controlsUI controls FileUpload, BulletedList, MultiView, Wizard, etc.FileUpload, BulletedList, MultiView, Wizard, etc.



UI ControlsUI ControlsNameName DescriptionDescription

BulletedListBulletedList Renders bulleted lists of itemsRenders bulleted lists of items

FileUploadFileUpload UI for uploading files to Web serversUI for uploading files to Web servers

HiddenFieldHiddenField Renders hidden fieldsRenders hidden fields

ImageMapImageMap Renders HTML image mapsRenders HTML image maps

MultiViewMultiView Defines multiple views displayed one at a timeDefines multiple views displayed one at a time

ViewView Defines views in MultiView controlsDefines views in MultiView controls

WizardWizard Guides users through stepwise proceduresGuides users through stepwise procedures

SubstitutionSubstitution Designates non-cached regions of cached pagesDesignates non-cached regions of cached pages



The ImageMap The ImageMap ControlControl

<asp:ImageMap ImageUrl="Shapes.jpg" OnClick="OnUpdate" RunAt="server"> <asp:CircleHotSpot X="50" Y="50" Radius="50" PostBackValue="Circle" AlternateText="Circle" HotSpotMode="Postback" RunAt="server" /> <asp:RectangleHotSpot Left="0" Top="100" Right="100" Bottom="200" PostBackValue="Rectangle" AlternateText="Rectangle" HotSpotMode="Postback" RunAt="server" /> <asp:PolygonHotSpot Coordinates="50, 200, 0, 300, 100, 300" PostBackValue="Triangle" AlternateText="Triangle" HotSpotMode="Postback" RunAt="server" /></asp:ImageMap> . . .<script language="C#" runat="server">void UpdateLabel (Object sender, ImageMapEventArgs e){ ...}</script>

<asp:ImageMap ImageUrl="Shapes.jpg" OnClick="OnUpdate" RunAt="server"> <asp:CircleHotSpot X="50" Y="50" Radius="50" PostBackValue="Circle" AlternateText="Circle" HotSpotMode="Postback" RunAt="server" /> <asp:RectangleHotSpot Left="0" Top="100" Right="100" Bottom="200" PostBackValue="Rectangle" AlternateText="Rectangle" HotSpotMode="Postback" RunAt="server" /> <asp:PolygonHotSpot Coordinates="50, 200, 0, 300, 100, 300" PostBackValue="Triangle" AlternateText="Triangle" HotSpotMode="Postback" RunAt="server" /></asp:ImageMap> . . .<script language="C#" runat="server">void UpdateLabel (Object sender, ImageMapEventArgs e){ ...}</script>



The FileUpload The FileUpload ControlControl

<asp:FileUpload ID="UploadControl" RunAt="server" /><asp:Button Text="Upload" OnClick="OnUpload" RunAt="server" /> . . .<script language="C#" runat="server">void OnUpload (Object sender, EventArgs e){ if (FileUploadControl.HasFile) { string name = UploadControl.PostedFile.FileName; // Path name Stream bits = UploadControl.PostedFile.InputStream; // Contents ... // Use the SaveAs method to persist to a local file FileInfo file = new FileInfo (UploadControl.PostedFile.FileName); UploadControl.SaveAs (Server.MapPath ("~/Uploads/" + file.Name); }}</script>

<asp:FileUpload ID="UploadControl" RunAt="server" /><asp:Button Text="Upload" OnClick="OnUpload" RunAt="server" /> . . .<script language="C#" runat="server">void OnUpload (Object sender, EventArgs e){ if (FileUploadControl.HasFile) { string name = UploadControl.PostedFile.FileName; // Path name Stream bits = UploadControl.PostedFile.InputStream; // Contents ... // Use the SaveAs method to persist to a local file FileInfo file = new FileInfo (UploadControl.PostedFile.FileName); UploadControl.SaveAs (Server.MapPath ("~/Uploads/" + file.Name); }}</script>



The MultiView ControlThe MultiView Control<asp:MultiView ID="Main" ActiveViewIndex="0" RunAt="server"> <asp:View RunAt="server"> ... </asp:View> <asp:View RunAt="server"> ... </asp:View> <asp:View RunAt="server"> ... </asp:View></asp:MultiView> . . .void OnSwitchView (Object sender, EventArgs e){ Main.ActiveViewIndex = 1; // Switch views}

<asp:MultiView ID="Main" ActiveViewIndex="0" RunAt="server"> <asp:View RunAt="server"> ... </asp:View> <asp:View RunAt="server"> ... </asp:View> <asp:View RunAt="server"> ... </asp:View></asp:MultiView> . . .void OnSwitchView (Object sender, EventArgs e){ Main.ActiveViewIndex = 1; // Switch views}



Declarative View Declarative View SwitchingSwitching

<asp:MultiView ID="Main" ActiveViewIndex="0" RunAt="server"> <asp:View RunAt="server"> ... <asp:Button CommandName="SwitchViewByIndex" CommandArgument="1"Text="Switch to view 2" RunAt="server" /> </asp:View> <asp:View RunAt="server"> ... <asp:Button CommandName="SwitchViewByIndex" CommandArgument="0" Text="Switch to view 1" RunAt="server" /> </asp:View></asp:MultiView>

<asp:MultiView ID="Main" ActiveViewIndex="0" RunAt="server"> <asp:View RunAt="server"> ... <asp:Button CommandName="SwitchViewByIndex" CommandArgument="1"Text="Switch to view 2" RunAt="server" /> </asp:View> <asp:View RunAt="server"> ... <asp:Button CommandName="SwitchViewByIndex" CommandArgument="0" Text="Switch to view 1" RunAt="server" /> </asp:View></asp:MultiView>

ASP.NET 2.0 ASP.NET 2.0 ControlsControlsASP.NET 2.0 ASP.NET 2.0 ControlsControls