Professional ASP.NET 3.5 in C# and Visual Basic Part 20 pptx

Evjen c03.tex V2 - 01/28/2008 12:33pm Page 144
Chapter 3: ASP.NET Web Server Controls
Choosing a Date Format to Output from the Calendar
When you use the
Calendar1_SelectionChanged
event, the selected date is written out using the
ToShortDateString()
method. The Calendar control also allows you to write out the date in a number
of other formats, as detailed in the following list:
❑
ToFileTime
: Converts the selection to the local operating system file time:
128571156000000000
.
❑
ToFileTimeUtc
: Converts the selection to the operating system file time, but instead of using the
local time zone, the UTC time is used:
128570976000000000
.
❑
ToLocalTime
: Converts the current coordinated universal time (UTC) to local time:
6/4/2008
7:00:00 PM
.
❑
ToLongDateString
: Converts the selection to a human-readable string in a long format:
Thursday, June 05, 2008
.

❑
ToLongTimeString
: Converts the selection to a time value (no date is included) of a long format:
12:00:00 AM
.
❑
ToOADate
: Converts the selection to an OLE Automation date equivalent:
39604
.
❑
ToShortDateString
: Converts the selection to a human-readable string in a short format:
6/4/2008
.
❑
ToShortTimeString
: Converts the selection to a time value (no da te is included) in a short for-
mat:
12:00 AM
.
❑
ToString
: Converts the selection to the following:
6/4/2008 12:00:00 AM
.
❑
ToUniversalTime
: Converts the selection to universal time (UTC):
6/4/2008 6:00:00 AM

.
Making Day, Week, or Month Selections
By default, the Calendar control enables you to make single day selections. You can use the
Selection-
Mode
property to change this behavior to allow your users to make week or month selections from the
calendar instead. The possible values of this property include
Day
,
DayWeek
,
DayWeekMonth
,and
None
.
The
Day
setting enables you to click a specific day in the calendar to highlight it (this is the default).
When you use the setting of
DayWeek
, you can st ill make individual day selections, but you can also click
the arrow next to the week (see Figure 3-25) to make selections that consist of an entire week. Using
the setting of
DayWeekMonth
lets users make individual day selections or w eek selections. A new a rrow
appears in the upper-left corner of the calendar that enables users to select an entire month (also shown
in Figure 3-25). A setting of
None
means that it is impossible f or the end user to make any selections,
which is useful for calendars on your site that are informational only.

Working with Date Ranges
Even if an end user makes a selection that encompasses an entire week or an entire month, you get back
from the selection only the first date of this range. If, for example, you allow users to select an entire
month and one selects July 2008, what you get back (using
ToShortDateString()
)is
7/1/2008
—the
first date in the date range of the selection. That might work for you, but if you require all the dates in
the selected range, Listing 3-21 shows you how to get them.
144
Evjen c03.tex V2 - 01/28/2008 12:33pm Page 145
Chapter 3: ASP.NET Web Server Controls
Figure 3-25
Listing 3-21: Retrieving a range of dates from a selection
VB
<
%@ Page Language="VB" %
>
<
script runat="server"
>
Protected Sub Calendar1_SelectionChanged(ByVal sender As Object, _
ByVal e As System.EventArgs)
Label1.Text = "
<
b
><
u
>

You selected the following date/dates:
<
/u
><
/b
><
br
>
"
For i As Integer = 0 To (Calendar1.SelectedDates.Count - 1)
Label1.Text += Calendar1.SelectedDates.Item(i).ToShortDateString() & _
"
<
br
>
"
Next
End Sub
<
/script
>
<
html xmlns=" />>
<
head id="Head1" runat="server"
>
<
title
>
Using the Calendar Control

<
/title
>
<
/head
>
Continued
145
Evjen c03.tex V2 - 01/28/2008 12:33pm Page 146
Chapter 3: ASP.NET Web Server Controls
<
body
>
<
form id="form1" runat="server"
>
<
div
>
<
asp:Calendar ID="Calendar1" runat="server"
OnSelectionChanged="Calendar1_SelectionChanged"
SelectionMode="DayWeekMonth"
>
<
/asp:Calendar
><
p
>
<

asp:Label ID="Label1" runat="server"
><
/asp:Label
><
/p
>
<
/div
>
<
/form
>
<
/body
>
<
/html
>
C#
<
%@ Page Language="C#" %
>
<
script runat="server"
>
protected void Calendar1_SelectionChanged(object sender, EventArgs e)
{
Label1.Text = "
<
b

><
u
>
You selected the following date/dates:
<
/u
><
/b
><
br
>
";
for (int i=0; i
<
Calendar1.SelectedDates.Count; i
++
){
Label1.Text += Calendar1.SelectedDates[i].ToShortDateString() +
"
<
br
>
";
}
}
<
/script
>
In this example, the Calendar control lets users make selections that can be an individual day, a week, or
even a month. Using a

For Next
loop, you iterate through a selection by using the
SelectedDates.Count
property. The code produces the results shown in Figure 3-26.
You can get just the first day of the selection by using the following:
VB
Calendar1.SelectedDates.Item(0).ToShortDateString()
C#
Calendar1.SelectedDates[0].ToShortDateString();
And you can get the last date in the selected range by using:
VB
Calendar1.SelectedDates.Item(Calendar1.SelectedDates.Count-1).ToShortDateString()
C#
Calendar1.SelectedDates[Calendar1.SelectedDates.Count-1].ToShortDateString();
As you can see, this is possible using the
Count
property of the
SelectedDates
object.
146
Evjen c03.tex V2 - 01/28/2008 12:33pm Page 147
Chapter 3: ASP.NET Web Server Controls
Figure 3-26
Modifying the Style and Behavior of Your Calendar
There is a lot to the Calendar control — definitely more than can be covered in this chapter. One nice
thing about the Calendar control is the ease of extensibility that it offers. Begin exploring new ways to
customize this control further by looking at one of the easiest ways to change it — applying a style to the
control.
Using Visual Studio, you can give the controls a new look-and-feel from the Design view of the page
you are working with. Highlight the Calendar control and open the control’s smart tag to see the Auto

Format link. That gives you a list of available styles that can be applied to your Calendar control.
The Calendar control is not alone in this capability. Many other rich controls offer a list of styles. You
can always find this capability in the control’s smart tag.
Some of the styles are shown in Figure 3-27.
In addition to changing the style of the Calendar control, you can w ork with the control during its ren-
dering process. The Calendar control includes an event called
DayRender
that allows you to control how a
single date or all the dates in the calendar are rendered. Listing 3-22 shows an example of how to change
one of the dates being rendered in the calendar.
147
Evjen c03.tex V2 - 01/28/2008 12:33pm Page 148
Chapter 3: ASP.NET Web Server Controls
Figure 3-27
Listing 3-22: Controlling how a day is rendered in the Calendar
VB
<
%@ Page Language="VB" %
>
<
script runat="server"
>
Protected Sub Calendar1_DayRender(ByVal sender As Object, _
ByVal e As System.Web.UI.WebControls.DayRenderEventArgs)
e.Cell.VerticalAlign = VerticalAlign.Top
If (e.Day.DayNumberText = "25") Then
148
Evjen c03.tex V2 - 01/28/2008 12:33pm Page 149
Chapter 3: ASP.NET Web Server Controls
e.Cell.Controls.Add(New LiteralControl("

<
p
>
User Group Meeting!
<
/p
>
"))
e.Cell.BorderColor = Drawing.Color.Black
e.Cell.BorderWidth = 1
e.Cell.BorderStyle = BorderStyle.Solid
e.Cell.BackColor = Drawing.Color.LightGray
End If
End Sub
<
/script
>
<
html xmlns=" />>
<
head id="Head1" runat="server"
>
<
title
>
Using the Calendar Control
<
/title
>
<

/head
>
<
body
>
<
form id="form1" runat="server"
>
<
div
>
<
asp:Calendar ID="Calendar1" runat="server"
OnDayRender="Calendar1_DayRender" Height="190px" BorderColor="White"
Width="350px" ForeColor="Black" BackColor="White" BorderWidth="1px"
NextPrevFormat="FullMonth" Font-Names="Verdana" Font-Size="9pt"
>
<
SelectedDayStyle ForeColor="White"
BackColor="#333399"
><
/SelectedDayStyle
>
<
OtherMonthDayStyle ForeColor="#999999"
><
/OtherMonthDayStyle
>
<
TodayDayStyle BackColor="#CCCCCC"

><
/TodayDayStyle
>
<
NextPrevStyle ForeColor="#333333" VerticalAlign="Bottom"
Font-Size="8pt" Font-Bold="True"
><
/NextPrevStyle
>
<
DayHeaderStyle Font-Size="8pt" Font-Bold="True"
><
/DayHeaderStyle
>
<
TitleStyle ForeColor="#333399" BorderColor="Black" Font-Size="12pt"
Font-Bold="True" BackColor="White" BorderWidth="4px"
>
<
/TitleStyle
>
<
/asp:Calendar
>
<
/div
>
<
/form
>

<
/body
>
<
/html
>
C#
<
%@ Page Language="C#" %
>
<
script runat="server"
>
protected void Calendar1_DayRender(object sender, DayRenderEventArgs e)
{
e.Cell.VerticalAlign = VerticalAlign.Top;
if (e.Day.DayNumberText == "25")
{
e.Cell.Controls.Add(new LiteralControl("
<
p
>
User Group Meeting!
<
/p
>
"));
e.Cell.BorderColor = System.Drawing.Color.Black;
e.Cell.BorderWidth = 1;
e.Cell.BorderStyle = BorderStyle.Solid;

e.Cell.BackColor = System.Drawing.Color.LightGray;
}
}
<
/script
>
149
Evjen c03.tex V2 - 01/28/2008 12:33pm Page 150
Chapter 3: ASP.NET Web Server Controls
In this example, you use a Calendar control with a little style to it. When the page is built and run in the
browser, you can see that the 25th of every month in the calendar has been changed by the code in the
Calendar1_DayRender
event. The calendar is shown in Figure 3-28.
Figure 3-28
The Calendar control in this example adds an
OnDayRender
attribute that points to the
Calendar1_
DayRender
event. The method is run for each of the days rendered in the calendar. The class constructor
shows that you are not working with the typical
System.EventArgs
class, but instead with the
DayRen-
derEventArgs
class. It gives you access to each of the days rendered in the calendar.
The two main properties from the
DayRenderEventArgs
class are
Cell

and
Day
.The
Cell
property gives
you access to the space in which the day is being rendered, and the
Day
property gives you access to the
specific date being rendered in the cell.
From the actions being taken in the
Calendar1_DayRender
event, you can see that both properties are
used.First,the
Cell
property sets the vertical alignment of the cell to
Top
. If it didn’t, the table might
look a little strange when one of the cells has content. Next, a check is made to see if the day being
rendered (checked with the
Day
property) is the 25th of the month. If it is, the
If Then
statement runs
using the
Cell
property to change the styling of just that cell. The styling change adds a control, as well
as makes changes to the border and color of the cell.
150
Evjen c03.tex V2 - 01/28/2008 12:33pm Page 151
Chapter 3: ASP.NET Web Server Controls

As you can see, working with individual dates in the calendar is fairly straightforward. You can easily
give them the content and appearance you want.
A nice feature of the
Day
property is that you can turn off the option to select a particular date or range
of dates by setting the
Day
property’s
IsSelectable
property to
False
:
VB
If (e.Day.Date
<
DateTime.Now) Then
e.Day.IsSelectable = False
End If
C#
if (e.Day.Date
<
DateTime.Now) {
e.Day.IsSelectable = false;
}
AdRotator Server Control
Although Web users find ads rather annoying, advertising continues to be prevalent everywhere on the
Web. With the AdRotator control, you can configure your application to show a series of advertisements
to the end users. With this control, you can use advertisement data from sources other than the standard
XML file that was used with the previous versions of this control.
If you a re using an XML source for the ad information, first create an XML advertisement file. The adver-

tisement file allows you to incorporate some new elements that give you even more control over the
appearance and behavior of your ads. Listing 3-23 shows an example of an XML advertisement file.
Listing 3-23: The XML advertisement file
<
?xml version="1.0" encoding="utf-8" ?
>
<
Advertisements
xmlns=" />>
<
Ad
>
<
ImageUrl
>
book1.gif
<
/ImageUrl
>
<
NavigateUrl
>

<
/NavigateUrl
>
<
AlternateText
>
Visit Wrox Today!

<
/AlternateText
>
<
Impressions
>
50
<
/Impressions
>
<
Keyword
>
VB.NET
<
/Keyword
>
<
/Ad
>
<
Ad
>
<
ImageUrl
>
book2.gif
<
/ImageUrl
>

<
NavigateUrl
>

<
/NavigateUrl
>
<
AlternateText
>
Visit Wrox Today!
<
/AlternateText
>
<
Impressions
>
50
<
/Impressions
>
<
Keyword
>
XML
<
/Keyword
>
<
/Ad

>
<
/Advertisements
>
This XML file, used for storing information about the advertisements that appear in your application, has
just a few elements detailed in the following table. Remember that all elements are optional.
151
Evjen c03.tex V2 - 01/28/2008 12:33pm Page 152
Chapter 3: ASP.NET Web Server Controls
Element Description
ImageUrl
Takes a string value that indicates the location of the image to use.
NavigateUrl
Takes a string value that indicates the URL to post to when the image is clicked.
AlternateText
Takes a string value that is used for display either if images are turned off in the
client’s browser or if the image is not found.
Impressions
Takes a numerical value that indicates the likelihood of the image being selected
for display.
Keyword
Takes a string value that sets the category of the image in order to allow for the
filtering of ads.
Now that the XML advertisement file is in place, you can simply use the AdRotator control to read from
this file. Listing 3-24 shows an example of this in action.
Listing 3-24: Using the AdRotator control as a banner ad
<
%@ Page Language="VB" %
>
<

html xmlns=" />>
<
head runat="server"
>
<
title
>
AdRotator Page
<
/title
>
<
/head
>
<
body
>
<
form id="form1" runat="server"
>
<
asp:AdRotator ID="AdRotator1" runat="server"
AdvertisementFile="MyAds.xml" /
>
<
p
>
Lorem ipsum dolor sit
amet, consectetuer adipiscing elit. Duis vel justo. Aliquam
adipiscing. In mattis volutpat urna. Donec adipiscing, nisl eget

dictum egestas, felis nulla ornare ligula, ut bibendum pede augue
eu augue. Sed vel risus nec urna pharetra imperdiet. Aenean
semper. Sed ullamcorper auctor sapien. Suspendisse luctus. Ut ac
nibh. Nam lorem. Aliquam dictum aliquam purus.
<
/p
>
<
/form
>
<
/body
>
<
/html
>
The example shows the ad specified in the XML advertisement file as a banner ad at the top of the page.
You are not required to place all your ad information in the XML advertisement file. Instead, you can
use another data source to which you bind the AdRotator. For instance, you bind the AdRotator to a
SqlDataSource
object that is retrieving the ad information from SQL Server in the following fashion:
<
asp:AdRotator ID="AdRotator1" runat="server"
DataSourceId="SqlDataSource1" AlternateTextField="AlternateTF"
ImageUrlField="Image" NavigateUrlField="NavigateUrl" /
>
The
AlternateTextField
,
ImageUrlField

,and
NavigateUrlField
properties point to the column names
that are used in SQL Server for those items.
152
Evjen c03.tex V2 - 01/28/2008 12:33pm Page 153
Chapter 3: ASP.NET Web Server Controls
The Xml Server Control
The Xml server control provides a means of getting XML and transforming it using an XSL style
sheet. The Xml control can work with your XML in a couple of different ways. T he simplest method
is by using the construction shown in Listing 3-25. This control is covered in more detail in Chapter 10.
Listing 3-25: Displaying an XML document
<
asp:Xml ID="Xml1" runat="server" DocumentSource="~/MyXMLFile.xml"
TransformSource="MyXSLFile.xslt"
><
/asp:Xml
>
This method takes only a couple of attributes to make it work:
DocumentSource
, which points to the path
of the XML file, and
TransformSource
, which provides the XSLT file to use in transforming the XML
document.
The other way to use the Xml server control is to load the XML into an object and then pass the object to
the Xml control, as illustrated in Listing 3-26.
Listing 3-26: Loading the XML file to an object before providing it to the Xml control
VB
Dim MyXmlDoc as XmlDocument = New XmlDocument()

MyXmlDoc.Load(Server.MapPath("Customers.xml"))
Dim MyXslDoc As XslCompiledTransform = New XslCompiledTransform()
MyXslDoc.Load(Server.MapPath("CustomersSchema.xslt"))
Xml1.Document = MyXmlDoc
Xml1.Transform = MyXslDoc
C#
XmlDocument MyXmlDoc = new XmlDocument();
MyXmlDoc.Load(Server.MapPath("Customers.xml"));
XslCompiledTransform MyXsltDoc = new XslCompiledTransform();
MyXsltDoc.Load(Server.MapPath("CustomersSchema.xslt"));
Xml1.Document = MyXmlDoc;
Xml1.Transform = MyXslDoc;
To make this work, you have to ensure that the
System.Xml
and
System.Xml.Xsl
namespaces are
imported into your page. The example loads both the XML and XSL files and then assigns these files
as the values of the
Document
and
Transform
properties.
Panel Server Control
The Panel server control encapsulates a set of controls you can use to manipulate or lay out your ASP.NET
pages. It is basically a wrapper for other controls, enabling you to take a group of server controls along
with other elements (such as HTML and images) and turn them into a single unit.
153