The symptom

The search for a cause and a solution

The first step was this Microsoft KB Article that breaks down the 500.19 error based on the HResult: http://support.microsoft.com/kb/942055. Unfortunately, for the HResult above, 0x8007000d, the only cause listed is “a malformed XML elemen” in the web.config. After spending some time looking at the web.config I came to the conclusion there were no malformed tags.

The next solution I found was from JohnnyW on ASP.NET, http://forums.asp.net/p/1497910/3536801.aspx#3536801. JohnnyW’s error was evidently caused by Ajax not being properly installed. He includes this link on how to configure AJAX for ASP.NET. Since, due to some old controls we do require the AJAX 1.0 extensions to be installed I made the changes to the web.config it recommends, but still kept getting the same error.

I decided to manually hunt for the cause in the web.config and so I started to remove sections one at a time until the error disapeared and the site loaded.

The actual cause and soluion

<rewrite>
  <rules>
    <rule name="Redirect to www" stopProcessing="true">
      <match url=".*" />
      <conditions>
        <add input="{HTTP_HOST}" 
            pattern="^www.mySite.com$" />
        <add input="{HTTP_HOST}" 
            pattern="^mySite.com$" />
        <add input="{HTTP_HOST}" 
            pattern="^mySite.com$" />
      </conditions>
      <action type="Redirect" 
          url="http://www.my_Site.com/{R:0}"
          redirectType="Permanent" />
    </rule>
  </rules>
</rewrite>

Searching for information on redirect rules led me to http://geekswithblogs.net/kit/archive/2009/04/19/131291.aspx, where he explains you can use URL Rewrite “by installing the URL Rewrite Module.” This was what actually caused the 500.19 error. The server didn’t have the url rewrite module installed. I solved the issue by downloading the IIS URL Rewrite 2.0 from here: http://www.iis.net/download/URLRewrite and installing it. Instantly the 500.19 error was cleared up.

The symptom

What is was not

What is was

Caching dynamic content is great if it is a page such as a dynamically generated image gallery, or a page that is generated dynamically based on the browser’s culture. However, in this thread, http://forums.iis.net/t/1154347.aspx?PageIndex=2, Anil Ruia, a Senior Software Design Engineer on the IIS Core, explains, “You should not be enabling output caching for any response which depends on session state.”

If the page generating the content depends on the session state, it caches the session object along with the rest of the page. The next user to come through ends up pulling the cached session, instead of getting a new one. When I checked our settings I found it was set to cache all .aspx pages for three minutes, including many pages that access the session.

The solution

In IIS7, disable the caching for .aspx pages in any directory with an asp.net page that depends on the session state. To do this:

1. Run the Server Management console.
2. Navigate to Roles -> Web Server (IIS) -> Internet Information Services.
3. Select the site you wish to modify.
4. Select the folder that contains the .aspx pages you need to turn caching off for.
5. In the Feature View, double-click “Output Caching”.
6. If there is a rule there already for the .aspx extension double click it. Otherwise right click and select “Add…”
7. Enter .aspx for the “File name extension”
8. Check “User-mode caching”
9. Select “Prevent all caching”
10. Check “Kernel-mode caching”
11. Select “Prevent all caching”
12. Click OK
13. Close the Server management Console

When designing a website for a right to left (RTL) language the scrollbar should automatically be on the left hand side. The logic is that it should be at the end of the line, just as it is on the right for a left to right (LTR) language. This works fine in IE, but Firefox will always show the scrollbar on the right.

The Cause

Unfortunately this is by design. Firefox believes that the scrollbar is part of the browser, not the webpage and so by default a website should not have the ability to override the user’s settings. IE believes the scrollbar is not part of the browser but part of the page. Therefore, if a page is RTL the scrollbar should be on the left.

The Solution

This can be fixed on an individual instance of Firefox.

1. Open Firefox
2. Navigate to about:config
3. Set the filter to layout.scrollbar.side
4. Double click the layout.scrollbar.side line
5. Change the setting to 1 and click OK

Now Firefox will behave like IE and show the scrollbar on which ever side the page dictates. Unfortunately, this will not help any of your users. The best solution to assure your RTL website displays the scrollbar on the correct side is to use a third party customizable scrollbar, such as jQuery Scrollbar or jScrollPane.

What is WUMP?

After a frantic call from a client who found her site was down due to a server issue, I decided I needed a way to regularly monitor the sites I consult for. WUMP, the Website Uptime Monitor Program, is the resulting solution. Written in C# 2008, WUMP is made up of three projects.

1. AutoWump – A windows service to control the automated WUMPing, or testing, of sites
2. SledgeHammer – A class library that does the actual work
3. wump – A Windows application for customizing the settings, starting and stopping the AutoWump, and running manual tests.

Features:

• Automatically monitor the status of multiple websites at a set interval
• Manually check the status of multiple websites
• Test site statuses without affecting Google Analytics
• Maintain a log of test results
• Send an email alert if a test fails

How WUMP works:

In order to test the site without affecting the Google Analytics add a file to the root path of the site. The name of the file is configurable. By default it should be named “wump.html”. The file can simply be an empty page:

<html>
    <head>
        <title>WUMP</title>
    </head>
    <body>
    </body>
</html>

When a site is WUMPed, the program attempts to download the target file. If it encounters an error the test fails. A log is kept of all test results in a text file, by default “c:\wump.log”. In the event of a failed test result WUMP has the ability to send an email via SMTP.

Where to get WUMP:

WUMP is available as an open source project on CodePlex here: http://wump.codeplex.com/Wiki/View.aspx?title=Home&ProjectName=wump.

The CalendarExtender Plus is a modification of the calendar extender that ships as part of the Ajax Control Toolkit. There are two main features added to the control. First, you can limit the selectable dates to a specified date range. Second, there is now the option to show an alternate header. The new header includes two DropDown Lists, one to select the month and one to select the year.

CalendarExtender Plus 1.0.2.0 – New Properties By default the work week is from Monday to Friday. The two new properties, WorkWeekFirstDay and WorkWeekLastDay, can be used to change this. With the differentiation between work week and weekend, the properties EnableWorkDays and EnableWeekendDays will enable or disable their respective days. <cc1:CalendarExtenderPlus runat="server" ID="ceExample" TargetControlID="txtDate" ShowDdlHeader="true" EnableWeekendDays="false" />

CalendarExtender Plus 1.0.2.0 – New Default css

As recommended by Christian von Krogh, disabled dates are now grayed out by default. The new default css classes that control this are below. To hide the inactive dates completely change the color attribute to the same value as the background-color attribute.

.ajax__calendar .ajax__calendar_other .ajax__calendar_day 
    {background-color:#ffffff;border-color:#ffffff;color:#dbdbdb;cursor:default;}
.ajax__calendar .ajax__calendar_other .ajax__calendar_month 
    {background-color:#ffffff;border-color:#ffffff;color:#dbdbdb;cursor:default;}
.ajax__calendar .ajax__calendar_other .ajax__calendar_year 
    {background-color:#ffffff;border-color:#ffffff;color:#dbdbdb;cursor:default;}

CalendarExtender Plus 1.0.2.0 – Bug Fix

This version fixes the problem of the CalendarExtender Plus showing an error when viewing the page in design mode.

Just as the previous verison, CalendarExtender Plus is free to download, use, and distribute with your project. Any feedback is greatly appreciated!

Using CalendarExtender Plus 1.0.2.0

In order to add the CalendarExtender Plus to your page, you must first take these steps:

1. Drag the .dll file to your application’s “bin” directory and make sure you have a reference to it in your project.
2. Include the following at the top of your page:

<%@ Register Assembly=”CalendarExtenderPlus” Namespace=”AjaxControlToolkitPlus” TagPrefix=”cc1″ %>

Thank you Marc K for pointing out I forgot to include these instructions and posting them in the comments.

Among the controls on a page is an update panel with a button that when clicked causes a partial postback that takes at least a few seconds. During this time you want to show the user a wait message that will disappear as soon as the postBack completes.

Solution

There are two steps to this. The first is to show the message via JavaScript before the postBack begins and the second is to remove it at the end of the postBack in the codeBehind. This example involves redirecting an iFrame to display the wait message and then redirecting it again to show some search results. The same technique can be used to change any property of any control, such as the text of a label or the visibility of an image.

Step 1 – Client Side

Declare a JavaScript function to redirect the iFrame.

function loadIframe()
{
    var objIfLoading = document.getElementById('ifResults');
 
    objIfLoading.attributes['src'].value = 'Loading.aspx';
}

Place the button and the iFrame in an update panel. Make sure the iFrame has the runat=”server” tag and src=”". If the src is not set it will not run properly the first time the button is clicked in FireFox. Include in the search button’s declaration the OnClientClick attribute to call a JavaScript function.

<asp:UpdatePanel runat="server" ID="upExample">
   <ContentTemplate>
      <asp:Button runat="server" ID="btnSearch" Text="Search" 
         OnClientClick="loadIframe()" OnClick="btnSearch_Click" />
      <br />
      <iframe runat="server" id="ifResults" src=""
         width="800px" height="600px" frameborder="0">
      </iframe>
    </ContentTemplate>
</asp:UpdatePanel>

Step 2 – Server Side

Redirect the iFrame in the codeBehind after the search button has finished its work. To simulate the length of time it would take to find the search results I’ve added a sleep command.

protected void btnSearch_Click (object sender, EventArgs e)
{
    System.Threading.Thread.Sleep(3000);
    ifResults.Attributes["src"] = "LoadFinished.aspx";
}

Under normal circumstances when a page loads with a tabContainer on it one tab must be selected. The selected tab can be specified via the ActiveTabIndex property. What if the tabContainer needs to default to an empty tab with none of the tabs selected?

Solution

Add a dummy tabPanel to the tabContainer and leave it blank. Use the pageLoad JavaScript function to hide the tab’s header

<cc1:TabContainer ID="TabContainer1" runat="server" 
    Height="200px" Width="200px" ActiveTabIndex="0">
    <cc1:TabPanel runat="server" ID="tpDummy" HeaderText="">
        <ContentTemplate>
        </ContentTemplate>
    </cc1:TabPanel>
    <cc1:TabPanel runat="server" ID="tpName" HeaderText="Name">
        <ContentTemplate>
            Name:
            <asp:TextBox runat="server" ID="txtName" />
        </ContentTemplate>
    </cc1:TabPanel>
    <cc1:TabPanel runat="server" ID="tpEmail" HeaderText="Email">
        <ContentTemplate>
            Email:
            <asp:TextBox runat="server" ID="txtEmail" />
        </ContentTemplate>
    </cc1:TabPanel>
</cc1:TabContainer>

function pageLoad(sender, e)
{
    var objTpDummy = 
        document.getElementById('<%= tpDummy.ClientID %>' + '_tab');
    objTpDummy.style.display = 'none';
}

A page has a list of images for the user to choose from. When a file is selected the request is processed via an AJAX call that directs the source of an iFrame to another page where the image is generated and passed back to the client.

Due to the size of some of the images, the generation can take a noticeable amount of time. To make sure the user does not think the site is frozen a wait message is needed. Since the generating page only returns the image, we need another way to notify the client when the file is generated and the wait message can be hidden.

Solution

This can be accomplished using a session variable and a timer to keep track of the generated file’s status. In this example the first updatePanel holds a button to start the file download, a label that will be used for the wait message, and the timer. The iFrame is in a second panel, separate from the timer, so it does not reload every time the timer ticks.

<asp:UpdatePanel runat="server" ID="upDownload">
    <ContentTemplate>
 
        <asp:Button runat="server" ID="btnDownload" 
            Text="Generate Image" OnClick="btnDownload_Click" />
 
        <%--This labeled is used as the notification that the 
            file is being generated. Until it is needed, the 
            display is set to none--%>
        <asp:Label runat="server" ID="lblNotification" 
            Text="Downloading... Please Wait" Style="display: none;" />
 
        <%--The timer starts off as disabled and will be enabled when 
             the user clicks the above button--%>
        <asp:Timer runat="server" ID="tmrIndicator" Interval="1000" 
            OnTick="tmrIndicator_Tick" Enabled="false" />
 
    </ContentTemplate>
</asp:UpdatePanel>
 
<%--The iFrame is kept in a seperate update panel so it is not reloaded 
    every time the timer ticks--%>
<asp:UpdatePanel runat="server" ID="upFileGenerate" 
     UpdateMode="Conditional">
    <Triggers>
        <asp:AsyncPostBackTrigger ControlID="btnDownload" />
    </Triggers>
    <ContentTemplate>
        <iframe runat="server" id="ifrGeneratedFile" src="about:blank" 
            width="0" height="0" />
    </ContentTemplate>
</asp:UpdatePanel>

When the button is clicked, in addition to directing the iFrame to the new source, three things must be done. First, raise the flag indicating the file is being generated. Second, show the wait message. Third, enable the timer.

protected void btnDownload_Click (object sender, EventArgs e)
{
    //raise the flag the file is being generated
    Session["generating"] = true;
 
    //Show the notification
    lblNotification.Style["display"] = string.Empty;
 
    //direct the iframe to generate the file
    ifrGeneratedFile.Attributes["src"] = 
        "FileGenerator.aspx";
 
    //Enable the timer to check when the file has 
    //  finished being generated
    tmrIndicator.Enabled = true;
}

Every time the timer ticks, check if the session variable “generating” is still true. When it is back to false disable the timer and hide the wait message.

protected void tmrIndicator_Tick (object sender, EventArgs e)
{
    //The timer is set to disabled by default
 
    //Every time the timer ticks, check if the 
    //  file is still being generated
    if (Session["generating"].ToString() != bool.TrueString)
    {
        //if the file is finished being generated disable 
        //  the timer again and hide the notification
        tmrIndicator.Enabled = false;
        lblNotification.Style["display"] = "none";
    }
}

In the page generating the image include the following line before ending the response.

Session["generating"] = false;

The CalendarExtender Plus is a modification of the calendar extender that ships as part of the Ajax Control Toolkit. There are two main features added to the control. First, you can limit the selectable dates to a specified date range. Second, there is now the option to show an alternate header. The new header includes two DropDown Lists, one to select the month and one to select the year.

The available dates can be limited using the MaxDate and MinDate properties.

<cc1:CalendarExtenderPlus runat="server" ID="cepExample" 
    TargetControlID="txtExample" 
    MaximumDate="01/01/2009" MinimumDate="5/15/2009 />

Setting the ShowDdlHeader to true will show the heading with dropDownLists to select the month and year.

<cc1:CalendarExtenderPlus runat="server" ID="cepHeaderExample" 
    TargetControlID="txtExample" ShowDdlHeader="true" />

The Calendar Extender Plus has a few other enhancements, including the ability to show or hide the arrows in the heading to move back and forth a month, and a property to show or hide today’s date at the bottom of the calendar.

Since the CalendarExtender Plus is a modification of the standard extender it has all the properties and functionality of the original. It can be skinned using the normal css, and automatically fills the textBox with no need for additional javascript.

The CalendarExtender Plus is free to download, use, and distribute with your project. Any feedback is greatly appreciated!

The comboBox has a couple of server side events to deal with field changing.

• OnSelectedIndexChanged
• OnTextChanged

How can we catch the comboBox changing on the client side?

The Solution

Without access to these function on the client side, we need to use the client side events of the textBox that is contained within the comboBox. As with any textBox this one also has the onChange event, but the event does not run when the text was changed and the focus moved to another field. There are a few options:

• onKeyPress
• onKeyUp
• onBlur

The problem with onKeyPress is when it gets to the javascript function the value of the textBox is has not changed yet, leaving onKeyUp and onBlur. While onKeyUp will give the desired effect when the user presses a key on the keyboard, part of the point of a comboBox is the ability to use the mouse, which will not be captured by this event, leaving onBlur as the remaining option. It’s still not perfect, since the event won’t run until the focus is moved off the comboBox, but it appears to be the best option. In some cases you may want to use both onKeyUp and onBlur to get the best of both events, but be careful because when the user uses the keyboard and the moves the focus your event will run twice.

In the example below I have a comboBox named cmbExample and a javascript function that accepts the textBox calling it as a parameter, cmbExample_OnBlur(textBox). I add the onBlur event to the textBox in the Page_Load method in the code behind.

protected void Page_Load(object sender, EventArgs e)
{
    TextBox textBox = cmbExample.FindControl("TextBox") as TextBox;
 
    if (textBox != null)
    {
        textBox.Attributes.Add("onBlur", "cmbExample_OnBlur(this);");
    }
}