BoxOver .NET Web Control

• Download source code - 20.5 KB

Introduction

BoxOver WebControl is a JavaScript based ASP.NET WebControl. For a project I've written, I needed a tooltip JavaScript and searched for it. I've found BoxOver from http://boxover.swazz.org/. Then to use it quickly and easil,y I've converted it to a .NET control. This article is aimed to share this.

BoxOver has two classes: BoxOver and BoxOverControlConverter.

How it Works

BoxOverControlConverter

BoxOverControlConverter is based on ControlIDConverter. It is used to discover the .NET controls in the page. With the FilterControl method, all controls except BoxOver are returned.

public class BoxOverControlConverter : ControlIDConverter
{
    protected override bool FilterControl(Control control)
    {
        return control.GetType() != typeof (BoxOver);
    }
}

BoxOver

BoxOver is the WebControl part. It discovers the .NET controls in the page.

The "ControlToValidate" property selects the .NET control in the page. Well, maybe I can find a better name for it...

[TypeConverter(typeof (BoxOverControlConverter))]
[Category("Behavior")]
[Description("Determines the control to be added the tooltip.")]
public string ControlToValidate
{
    get
    {
        if (ViewState["ControlToValidate"] != null)
            return (string) ViewState["ControlToValidate"];
        else
            return string.Empty;
    }
    set { ViewState["ControlToValidate"] = value; }
}

Usage

Simply drag and drop the WebControl into the page. And then, from the Properties window, select the .NET control to add the tooltip from the ControlToValidate property.

All other properties to configure the JavaScript are categorized in the "BoxOver" category. For detailed instructions, see the original JavaScript documentation from http://boxover.swazz.org/.

After selecting the .NET control, type the body message. Otherwise, it throws an HttpException.

In Design mode, the control shows which control is attached to it. In runtime, it only adds an attribute to the selected control; it doesn't write any output itself.

In the web page's source, you'll see the "title" attribute added in the selected control.

That's all. I hope it will be useful.