Click here to Skip to main content
65,938 articles
CodeProject is changing. Read more.
Articles / web / ASP.NET

BoxOver .NET Web Control

3.20/5 (7 votes)
12 Feb 2007CPOL1 min read 1   141  
A .NET web control based on BoxOver JavaScript v 2.1.

Sample image

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.

C#
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...

C#
[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

Sample image

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.

Sample image

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.

Sample image

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

License

This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)