Home

Announcements

Virtual Tiers

.NET Applications
XML Web Services
SQL Server Database
Web Traffic Statistics
Much More...

Dedicated Servers

Windows 2003 Server
2.4 GHz Pentium 4
1024 MB RAM
80 GB Hard Drive
1000 GB/month
Fully Managed
Free Setup!
$268.00/month

Specialized Plans

10 or more Domains
Windows Services
Custom Plans

Learning & Support

About Us

Acceptable Use Policy

Testimonials

Link to Us

Custom Server Controls

Learn More about Server Intellect

ASP.NET ships with 45 built-in server controls that can be used out of the box (for details, see Web Forms Controls Reference). In addition to using the built-in ASP.NET controls, developers also can use controls developed by third-party vendors.

The following sample shows a simple calendar control. The Calendar control is declared within the page using an <acme:calendar runat=server> tag. Note that the <% Register %> directive at the top of the page is responsible for registering the "Acme" XML tag prefix with the "Acme" code namespace of the control implementation. The ASP.NET page parser will then utilize this namespace to load the Calendar control class instance at run time.

acme.aspx

<%@ Register TagPrefix="Acme" Namespace="AcmeVB" Assembly="AcmeVB" %>

Sub SubmitBtn_Click(Sender As Object, E As EventArgs)
Message.Text = "Hi " & Server.HtmlEncode(Name.Text) & ", you selected: " & Category.SelectedItem.Text & " on: " & MyCal.Date.ToShortDateString()
End Sub

</script>

<body>

<asp:adrotator AdvertisementFile="ads.xml" BorderColor="black" BorderWidth=1 runat="server"/>

Category: <asp:dropdownlist id="Category" runat=server>
<asp:listitem >psychology</asp:listitem>
<asp:listitem >business</asp:listitem>
<asp:listitem >popular_comp</asp:listitem>
</asp:dropdownlist>
</h3>

<asp:button text="Lookup" OnClick="SubmitBtn_Click" runat="server"/>

<p>

<Acme:Calendar id="MyCal" runat=server/>

<p>

<asp:label id="Message" runat="server"/>

</form>

</center>

</body>
</html>

acme.vb

Imports System
Imports System.Web
Imports System.Web.UI
Imports System.Collections
Imports System.Collections.Specialized
Imports Microsoft.VisualBasic
Imports System.Reflection

< _
Assembly : AssemblyTitle(""), _
Assembly : AssemblyDescription("A QuickStart Tutorial Assembly"), _
Assembly : AssemblyConfiguration(""), _
Assembly : AssemblyCompany("Microsoft Corporation"), _
Assembly : AssemblyProduct("Microsoft QuickStart Tutorials"), _
Assembly : AssemblyCopyright(" Microsoft Corporation. All rights reserved."), _
Assembly : AssemblyTrademark(""), _
Assembly : AssemblyCulture(""), _
Assembly : AssemblyVersion("1.0.*"), _
Assembly : AssemblyDelaySign(false), _
Assembly : AssemblyKeyFile(""), _
Assembly : AssemblyKeyName("") _
>
Namespace AcmeVB
Public Class Calendar :
Inherits Control :
Implements IPostBackEventHandler, IPostBackDataHandler
Dim Private monthNames(11) As String
Dim Private currentDate As DateTime = DateTime.Now
Dim private pBackColor As String = "#dcdcdc"
Dim private pForeColor As String = "#eeeeee"

Protected Overrides Sub OnInit(E As EventArgs)
Page.RegisterRequiresPostBack(Me)

currentDate = DateTime.Now

monthNames(0) = "January"
monthNames(1) = "February"
monthNames(2) = "March"
monthNames(3) = "April"
monthNames(4) = "May"
monthNames(5) = "June"
monthNames(6) = "July"
monthNames(7) = "August"
monthNames(8) = "September"
monthNames(9) = "October"
monthNames(10) = "November"
monthNames(11) = "December"
End Sub

Protected Overrides Sub LoadViewState(viewState As Object)
'If we've done a post-back, the old date will be available to us

If Not viewState Is Nothing
currentDate = DateTime.Parse(CStr(viewState))
End If
End Sub

Public Sub RaisePostBackEvent(eventArgument As String) Implements IPostBackEventHandler.RaisePostBackEvent
If eventArgument = Nothing Then Exit Sub

'Keep track of old date (for event firing purposes)

Dim oldDate As DateTime = currentDate

If String.Compare("NavNextMonth", eventArgument, true) = 0
currentDate = currentDate.AddMonths(1)
ElseIf String.Compare("NavPrevMonth", eventArgument, true) = 0
currentDate = currentDate.AddMonths(-1)
Else
Dim daySelected As Integer = Int32.Parse(eventArgument)
currentDate = new DateTime(currentDate.Year, currentDate.Month, daySelected)
End If
End Sub

Protected Overrides Function SaveViewState() As Object
'Save CurrentDate out as view state for postback scenarios
SaveViewState = currentDate.ToString()
End Function

Protected Overrides Sub Render(output As HtmlTextWriter)
If ((Not Page.Request.UserAgent = Nothing) AndAlso (Page.Request.UserAgent.IndexOf("MSIE 5.5") <> -1))
RenderUpLevel(output)
Else
RenderDownLevel(output)
End If
End Sub

Protected Sub RenderUpLevel(output As HtmlTextWriter)
output.WriteLine("<input name='" & UniqueID & "_CurrentDate' id='" & UniqueID & "_CurrentDate' type=hidden>")
output.WriteLine("<span id='" & UniqueID & "'></span>")
output.WriteLine("<script language=jscript>drawcalendar('" & UniqueID & "', '" & currentDate.Year.ToString() & "/" & currentDate.Month.ToString() & "/" & currentDate.Day.ToString() & "');</script>")
End Sub

Protected Overrides Sub OnPreRender(E As EventArgs)
Dim DHTMLFunction As String = ""

DHTMLFunction = DHTMLFunction & DHTMLFunction = DHTMLFunction & " DHTMLFunction = DHTMLFunction & " DHTMLFunction = DHTMLFunction & " DHTMLFunction = DHTMLFunction & " DHTMLFunction = DHTMLFunction & " DHTMLFunction = DHTMLFunction & " DHTMLFunction = DHTMLFunction & " DHTMLFunction = DHTMLFunction & " DHTMLFunction = DHTMLFunction & " DHTMLFunction = DHTMLFunction & " DHTMLFunction = DHTMLFunction & " DHTMLFunction = DHTMLFunction & " DHTMLFunction = DHTMLFunction & " DHTMLFunction = DHTMLFunction & " DHTMLFunction = DHTMLFunction & " DHTMLFunction = DHTMLFunction & " DHTMLFunction = DHTMLFunction & " DHTMLFunction = DHTMLFunction & " DHTMLFunction = DHTMLFunction & " DHTMLFunction = DHTMLFunction & " DHTMLFunction = DHTMLFunction & " DHTMLFunction = DHTMLFunction & " DHTMLFunction = DHTMLFunction & " DHTMLFunction = DHTMLFunction & " DHTMLFunction = DHTMLFunction & " DHTMLFunction = DHTMLFunction & " DHTMLFunction = DHTMLFunction & " DHTMLFunction = DHTMLFunction & " DHTMLFunction = DHTMLFunction & " DHTMLFunction = DHTMLFunction & " DHTMLFunction = DHTMLFunction & " DHTMLFunction = DHTMLFunction & " DHTMLFunction = DHTMLFunction & " DHTMLFunction = DHTMLFunction & " DHTMLFunction = DHTMLFunction & " DHTMLFunction = DHTMLFunction & " DHTMLFunction = DHTMLFunction & " DHTMLFunction = DHTMLFunction & " DHTMLFunction = DHTMLFunction & " DHTMLFunction = DHTMLFunction & " DHTMLFunction = DHTMLFunction & " DHTMLFunction = DHTMLFunction & " DHTMLFunction = DHTMLFunction & " DHTMLFunction = DHTMLFunction & " DHTMLFunction = DHTMLFunction & " DHTMLFunction = DHTMLFunction & " DHTMLFunction = DHTMLFunction & " DHTMLFunction = DHTMLFunction & " DHTMLFunction = DHTMLFunction & " DHTMLFunction = DHTMLFunction & " DHTMLFunction = DHTMLFunction & " DHTMLFunction = DHTMLFunction & " DHTMLFunction = DHTMLFunction & " DHTMLFunction = DHTMLFunction & " DHTMLFunction = DHTMLFunction & " DHTMLFunction = DHTMLFunction & " DHTMLFunction = DHTMLFunction & " DHTMLFunction = DHTMLFunction & " DHTMLFunction = DHTMLFunction & " DHTMLFunction = DHTMLFunction & " DHTMLFunction = DHTMLFunction & " DHTMLFunction = DHTMLFunction & " DHTMLFunction = DHTMLFunction & DHTMLFunction = DHTMLFunction.Replace("\n", "<script language='JavaScript'> \n"
function drawcalendar(calname, newDate) \n"
{ \n"
var CurrentDate = new Date(newDate);\n"
var MonthArray = new Array('January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December');\n"
var MonthDays = new Array(31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31);\n"
var calText;\n"
calText = '<table bgcolor=#dcdcdc border=0 height=190 valign=top>';\n"
calText = calText + '<tr><td>';\n"
calText = calText + '<center>';\n"
calText = calText + ""<a href='javascript:drawcalendar(\"""" + calname + ""\"", \"""" + CurrentDate.getFullYear() + ""/"" + CurrentDate.getMonth() + ""/"" + CurrentDate.getDate() + ""\"")'>"";\n"
calText = calText + '<img src=/quickstart/aspplus/images/left4.gif width=11 height=11 border=0></a>';\n"
calText = calText + ' <b>' + MonthArray[CurrentDate.getMonth()] + ' ' + CurrentDate.getFullYear() + '</b>';\n"
calText = calText + "" <a href='javascript:drawcalendar(\"""" + calname + ""\"", \"""" + CurrentDate.getFullYear() + ""/"" + (CurrentDate.getMonth() + 2) + ""/"" + CurrentDate.getDate() + ""\"")'>"";\n"
calText = calText + '<IMG SRC=/quickstart/aspplus/images/right4.gif width=11 height=11 border=0></a>';\n"
calText = calText + '</center>';\n"
calText = calText + '</td></tr>';\n"
calText = calText + '<tr valign=top><td valign=top>';\n"
calText = calText + '<table border=1 bgcolor=#eeeeee height=160>';\n"
calText = calText + '<tr height=20>';\n"
calText = calText + ' <td align=right width=23> Sun </td>';\n"
calText = calText + ' <td align=right width=23> Mon </td>';\n"
calText = calText + ' <td align=right width=23> Tue </td>';\n"
calText = calText + ' <td align=right width=23> Wed </td>';\n"
calText = calText + ' <td align=right width=23> Thu </td>';\n"
calText = calText + ' <td align=right width=23> Fri </td>';\n"
calText = calText + ' <td align=right width=23> Sat </td>';\n"
calText = calText + '</tr>';\n"
calText = calText + '<tr>';\n"
var numDays = MonthDays[CurrentDate.getMonth()];\n"
firstDay = CurrentDate.getDay();\n"
for (var x=0; x<firstDay; x++)\n"
{\n"
calText = calText + '<td align=right width=23></td>'\n"
}\n"
for (var x=1; x<=numDays; x++) \n"
{ \n"
if (CurrentDate.getDate() == x) \n"
{ \n"
calText = calText + '<td align=right width=23>';\n"
calText = calText + '<font color=red><b><u>' + x + '</u></b></font>';\n"
calText = calText + '</td>';\n"
}\n"
else \n"
{ \n"
calText = calText + '<td align=right width=23>';\n"
calText = calText + ""<a href='javascript:drawcalendar(\"""" + calname + ""\"", \"""" + CurrentDate.getFullYear() + ""/"" + (CurrentDate.getMonth()+1) + ""/"" + x + ""\"")'>"" + x + ""</a>"";\n"
calText = calText + '</td>';\n"
}\n"
if (((firstDay+x) % 7) == 0)\n"
{\n"
calText = calText + '</tr><tr>';\n"
}\n"
}\n"
calText = calText + '</tr>';\n"
calText = calText + '</table></td></tr></table>';\n"
var CalendarSpan = document.all(calname);\n"
if (CalendarSpan != null)\n"
CalendarSpan.innerHTML = calText;\n"
var CalendarValue = document.all(calname + '_CurrentDate');\n"
if (CalendarValue != null)\n"
CalendarValue.value = '' + (CurrentDate.getMonth() + 1) + '/' + CurrentDate.getDate() + '/' + CurrentDate.getFullYear();\n"
} \n"
"</script>\n"
Chr(10))

If ((Not Page.Request.UserAgent = Nothing) AndAlso (Page.Request.UserAgent.IndexOf("MSIE 5.5") <> -1))
Page.RegisterClientScriptBlock("ACME_CALENDAR_DHTML", DHTMLFunction)
End If
End Sub

Protected Sub RenderDownLevel(output As HtmlTextWriter)
'Output Calendar Header

output.WriteLine("<table bgcolor=" & backColor & " border=0 height=190 valign=top><tr><td>")
output.WriteLine("<table bgcolor=" & backColor & " border=0 height=190 valign=top>")
output.WriteLine("<tr><td>")
output.WriteLine("<center>")
output.WriteLine(" <a href=""javascript:" & Page.GetPostBackEventReference(Me, "NavPrevMonth") & """>")
output.WriteLine("<img src=/quickstart/aspplus/images/left4.gif width=11 height=11 border=0></a>")
output.WriteLine(" <b>" & monthNames(currentDate.Month-1) & " " & currentDate.Year.ToString() & "</b>")
output.WriteLine(" <a href=""javascript:" & Page.GetPostBackEventReference(Me, "NavNextMonth") & """>")
output.WriteLine("<IMG SRC=/quickstart/aspplus/images/right4.gif width=11 height=11 border=0></a>")
output.WriteLine("</center>")
output.WriteLine("</td></tr>")
output.WriteLine("<tr valign=top><td valign=top>")
output.WriteLine("<table border=1 bgcolor=" & foreColor & " height=160>")
output.WriteLine("<tr height=20>")
output.WriteLine(" <td align=right width=23> Sun </td>")
output.WriteLine(" <td align=right width=23> Mon </td>")
output.WriteLine(" <td align=right width=23> Tue </td>")
output.WriteLine(" <td align=right width=23> Wed </td>")
output.WriteLine(" <td align=right width=23> Thu </td>")
output.WriteLine(" <td align=right width=23> Fri </td>")
output.WriteLine(" <td align=right width=23> Sat </td>")
output.WriteLine("</tr>")
output.WriteLine("<tr>")

'Calculate how many days are in the month

Dim numDays As Integer = DateTime.DaysInMonth(currentDate.Year, currentDate.Month)

'Calculate what day of week the first day of the month is on

Dim firstDay As Integer = New DateTime(currentDate.Year, currentDate.Month, 1).DayOfWeek

'Pre-Day Padding
Dim x As Integer

For x = 0 To firstDay - 1
output.WriteLine("<td align=right width=23></td>")
Next

'Output each day

For x = 1 To numDays
If currentDate.Day = x
output.Write("<td align=right width=23>")
output.Write("<font color=red><b><u>" & x.ToString() & "</u></b></font>")
output.WriteLine("</td>")
Else
output.Write("<td align=right width=23>")
output.Write("<a href=""javascript:" & Page.GetPostBackEventReference(Me, x.ToString()) & """>")
output.Write(x.ToString() & "</a>")
output.WriteLine("</td>")
End If

'PerPage row break as appropriate
If ((firstDay+x) Mod 7) = 0
output.WriteLine("</tr><tr>")
End If
Next

output.WriteLine("</tr>")
output.WriteLine("</table></td></tr></table></table>")
End Sub

Public Property [Date] As DateTime
Get
Return currentDate
End Get
Set
currentDate = Value
End Set
End Property

Public Property BackColor As String
Get
Return pBackColor
End Get
Set
pBackColor = Value
End Set
End Property

Public Property ForeColor As String
Get
Return pForeColor
End Get
Set
pForeColor = Value
End Set
End Property

Public Function LoadPostData(postDataKey As String, values As NameValueCollection) As Boolean Implements IPostBackDataHandler.LoadPostData
Dim clientDate As String = values(UniqueID & "_CurrentDate")

If Not clientDate = Nothing
Try
currentDate = DateTime.Parse(clientDate)
Catch
currentDate = DateTime.Now
End Try
End If

Return False
End Function

Public Sub RaisePostDataChangedEvent() Implements IPostBackDataHandler.RaisePostDataChangedEvent
End Sub
End Class
End Namespace

ads.xml

<Advertisements>

<Ad>
<ImageUrl>banner1.gif</ImageUrl>
<NavigateUrl>http://www.microsoft.com</NavigateUrl>
<AlternateText>Alt Text</AlternateText>
<Keyword>Computers</Keyword>
<Impressions>80</Impressions>
</Ad>

<Ad>
<ImageUrl>banner2.gif</ImageUrl>
<NavigateUrl>http://www.microsoft.com</NavigateUrl>
<AlternateText>Alt Text</AlternateText>
<Keyword>Computers</Keyword>
<Impressions>80</Impressions>
</Ad>

<Ad>
<ImageUrl>banner3.gif</ImageUrl>
<NavigateUrl>http://www.microsoft.com</NavigateUrl>
<AlternateText>Alt Text</AlternateText>
<Keyword>Computers</Keyword>
<Impressions>80</Impressions>
</Ad>

</Advertisements>

The Calendar control in this sample has been designed to perform "uplevel-like" processing on Internet Explorer 5.5 and "downlevel" processing on all other browsers. This browser sniffing is nowhere near as complex as that provided by the ASP.NET built-in server controls. For Internet Explorer 5.5 browsers it generates DHTML output. This DHTML output does not require round trips back to the server when doing day selections and month navigations. For all other browsers the control generates standard HTML 3.2. This HTML 3.2 does require round trips back to the server to handle client-side user interactions.

Important: The code that a page developer writes is identical regardless of whether an "uplevel" or "downlevel" browser is used to access the page. The Calendar control itself encapsulates all of the logic required to handle the two scenarios.