The AnywherePlaceHolder. Part 3. The AnywhereValidationSummaryPlaceHolder

• Download source - 15.8 Kb

Introduction

When writing accessible websites, we are told that frames are wrong. But with web-applications for the local intranet of your company or your customers, frames can be very useful. But why is it that we ASP.NET developers rarely use frames for our web-applications? Not because we don't like frames, but because ASP.NET limits us to the page we are currently building, disallowing us to reach out of our 'frame' and altering other frames, without refreshing them constantly.

This article is part three of a trilogy, in which I present the AnywherePlaceHolder. A control that functions like a normal PlaceHolder (with children), but that enables you to render the child controls in any frame of your web-application. The control is built in the new ASP.NET 2.0 and uses generics and is deeply coupled with the ASP.NET 2.0 client side JavaScript functions.

If you did not read the first or second part of this article, I'd advice you to read them first: The AnywherePlaceHolder. Part 1: The Simple AnywherePlaceHolder and The AnywherePlaceHolder. Part 2: The Advanced AnywherePlaceHolder.

In the first part of this article, I'd present the BaseAnywherePlaceHolder and the SimpleAnywherePlaceHolder. The SimpleAnywherePlaceHolder is only used to explain the basics of the real AnywherePlaceHolder that was explained in part two. The SimpleAnywherePlaceHolder can write normal controls like Labels, Tables, GridViews to any desired frame.

In part two, I explained the working of the AnywherePlaceHolder that enables you to write basically any content, including submit buttons, to any other frame, with respect to their functionality. Even JavaScript code still works.

In this part, I will explain the working of the AnywhereValidationSummaryPlaceHolder. It inherits from BaseAnywherePlaceHolder and has the functionality of a normal ValidationSummary. This special PlaceHolder allows you to write your custom messages and validation error messages into the frame of choice.

References

The AnywhereValidationSummaryPlaceHolder uses the JavaScriptBuilder class, which is designed by Paul Riley. See the JavaScriptBuilder: JavaScript Handler Class for Custom Controls here at The Code Project.

ASP.NET 2.0

This project is written for ASP.NET 2.0, and will not compile under .NET 1.x. However I believe that it can be ported back to .NET 1.x, with a little bit of effort.

Using the code

In this part, we'll be examining the AnywhereValidationSummaryPlaceHolder class. Below is the class diagram:

The AnywhereValidationSummaryPlaceHolder inherits from BaseAnywherePlaceHolder, but in contrast with the AnywherePlaceHolder (discussed in part two) this class is really a System.Web.UI.WebControls.ValidationSummary in disguise. Look at the AnywhereValidationSummaryPlaceHolder's code:

public class AnywhereValidationSummaryPlaceHolder : BaseAnywherePlaceHolder
{
    private ValidationSummary _validationSummary;

    /// <summary>Constructor</summary>
    public AnywhereValidationSummaryPlaceHolder()
        : base()
    {
        this._validationSummary = new ValidationSummary();

        this.SourceControl = this._validationSummary;
        
        // Adding the controls to the hierarchy.
        this.Controls.Add(this._validationSummary);
    }

    // Some code left out
    
    #region ValidationSummary members

    public override Color BackColor
    {
        get { return this._validationSummary.BackColor; }
        set { this._validationSummary.BackColor = value; }
    }

    public override BorderStyle BorderStyle
    {
        get { return this._validationSummary.BorderStyle; }
        set { this._validationSummary.BorderStyle = value; }
    }

    public override Color BorderColor
    {
        get { return this._validationSummary.BorderColor; }
        set { this._validationSummary.BorderColor = value; }
    }

    // Some code left out
    
    #endregion // ValidationSummary members
}

The AnywhereValidationSummaryPlaceHolder instantiates a private System.Web.UI.WebControls.ValidationSummary. The public WebControl layout properties are redirected to the inner ValidationSummary. As you can see in the constructor, the inner ValidationSummary is added to the AnywhereValidationSummaryPlaceHolder's controls hierarchy by calling this.Controls.Add(this._validationSummary);. Now the ValidationSummary is a child control and as we know from the previous two parts of this article, the summary can now be rendered anywhere we want.

Done? No, not really. However, the ValidationSummary will be displayed in the other frame, we're missing one important thing. As you might know, the ValidationSummary displays the ErrorMessages from the validator controls. Not only after a postback are they displayed, but most of the time without a postback, through JavaScript.

So what we must do is fool the ASP.NET framework to make it think it is changing the old ValidationSummary, while it is in fact injecting the messages into the new summary. Below is the JavaScript code that is rendered into the page:

// Fetch the placeholder from this frame
var AnywhereValidationSummaryPlaceHolder = 
    document.all ? document.all["AnywhereValidationSummaryPlaceHolder"] :
        document.getElementById("AnywhereValidationSummaryPlaceHolder");

// Fetch the summary from this frame
var ctl05 = document.all ? document.all["ctl05"] : 
    document.getElementById("ctl05");

// write the summary to the destination frame
AnywhereSummaryWriter('Summary', 'AnywhereValidationSummaryPlaceHolder', 
    parent, true);

// Fetch the destination placeholder
var dest_AnywhereValidationSummaryPlaceHolder = document.all ? 
    parent.document.all["Summary"] : parent.document.getElementById("Summary");

// Fetch the destination summary
var dest_ctl05 = document.all ? parent.document.all["ctl05"] : 
    parent.document.getElementById("ctl05");
dest_ctl05.displaymode = "List";

// Change the reference to the summary in a reference to 
// the new summary in the destination frame
if (dest_AnywhereValidationSummaryPlaceHolder != null && 
    dest_ctl05 != null && typeof(Page_ValidationSummaries) != "undefined")
{
    var counter;
    var error = true;
    for (counter = 0; counter < Page_ValidationSummaries.length; counter++)
    {
        if (Page_ValidationSummaries[counter] == ctl05)
        {
            Page_ValidationSummaries[counter] = dest_ctl05;
            error = false;
        }
    }
    if (error == true) alert('Element ctl05 could not be ' + 
        'found in jscript for AnywhereValidationSummary.');
}

The JavaScript code above inserts the ValidationSummary control into the destination frame, gets its reference and replaces the reference to the current ValidationSummary with the new ValidationSummary in the Page_ValidationSummaries array. This array holds the page's ValidationSummary controls.

Conclusion

In these three articles I tried to explain shortly how you can go beyond the boundaries of the HTML frames. While the method I provided is far from perfect, it works pretty nice in some controlled circumstances. But when you have at design time no clue what type of controls you will beam to other pages, then it is likely this will go wrong sometime. The model now cannot deal with custom JavaScript functions. It only recognizes the predefined JavaScript functions from the ASP.NET 2.0 framework.

Happy coding!

History

• 22 August, 2005 - Version 1.0. Initial version.