.NET Answers

Ever since pop-up windows became “evil” in the web development world, developers have been looking for other ways to achieve the same effect.  The most common method is to use some sort of absolute positioned DIV, but even doing that, a lot of the work is in making the pop-up look like a dialog.

Now, with the dialog widget available in the jQuery UI library, our lives have become much easier.

Creating a basic dialog in jQuery doesn’t require a whole lot of work.  However, there are a few things you need to remember.  First, you are going to need to use the UI themes from the jQuery UI library.  Remember from previous posts that we make the UI themes part of our ASP.NET themes, so you’ll need to set the theme for your document.

The basic HTML for your code should look something like this:

<div id="dialog" title="Here is the dialog title">
Here is content for the dialog
</div>

The Title attribute will become the title of the dialog.

Our jQuery that turns this into a dialog looks like this:

$(function() {
    $("#dialog").dialog();
});

The dialog you end up with is resizable and NOT modal.  To make it modal requires that you deal with the parameters you can hand into the dialog method.

There are so many ways that you can configure a jQuery dialog that I’m going to save that information for a second post on the subject.

Other Related Items:

ASP.Net Essential TrainingThousands of businesses have used ASP.NET to build

Londons Times Funny Food Coffee other Digestibles - Javascript - Light Switch Covers - single toggle switchJavascript Light Switch Cover is new and handcrafted utilizing unique process resulting in a stunning high gloss ceramic-like finish. SET OF MATCHING SCREWS IS INCLUDED giving it a perfect finishing touch. Made of durable metal material.

Inside Mortise Bath room. Lockset, With Turn PieceAn ideal choice when you need a good quaility lockset. Suitable for a privacy lock to bathroom, bedroom, Basement, storage closet, This mortise door l... Read More >

Related Post

• Do you Need My Help?
• jQuery Dialog – With Validation Controls
• Getting started with jQuery and ASP.NET
• jQuery 1.4 Released
• jQuery and ASP.NET UpdatePanel

Bookmark to:

Hide Sites

4 Responses to “jQuery – Dialog”