Andy Smith's Blog

Page.RegisterStartupScript('Andy', 'MetaBuilders_WebControls_GainKnowledge();');

asp.net dialogs aren't impossible

Custom Dialogs in asp.net

It seemed like they'd always be a real pain, until Jesse Ezell blogged about his team's frustration with it, along with some neato example code for how they solved it. It was a great idea, and Jesse should definitely be praised for posting it to the community.

However, typical me, I wanted a better Plop-It-In© experience with the dialog control. I was also a little unhappy with a couple aspects of it, such as violating the rule of Thou Shalt Not Call __doPostBack Directly. So I started pounding out code.

The first thing I did was reorganize everything so that handling the standard dialog was simply a matter of adding event handler that got the results. However, the first time I went to test my new creation... my Google Toolbar Popup Blocker blocked the popup dialog. D'oh. This was because the window.open was written to the postback's response stream from a serverside call to Open. Holding down ctrl quickly got old. So I added button and linkbutton controls that are pointed at dialog window controls, and open the dialog immediately on clientside click, thus eliminating both the popup blocker problem and the extra postback.

After that initial framework was done, I was thinking hey, I should provide some useful generic dialogs in the box... And since jscript is missing the InputBox and flexible MessageBox of VB, I figured those would be great candidates. I decided to implement them using classes inside the assembly, using the IHttpHandler interface stuff. There is a bit of Good vs. Bad in that decision. Good: Only one file, the control assembly, needs to be kept track of by the app developer. Bad: The handler factory needs to be registered in web.config or the built in dialogs don't work. And what made the Bad even worse, was that there's no api to determine if handlers are registered. But in the end I decided to stick with a handler factory, because, well, I think they are cool and ultimately easier to manage.

The actual implementation of the InputBox and MessageBox are fairly vanilla. They derive from DialogPage, which derives from Page, so I got the IHttpHandler implementation for free. They are basically just no-declaration aspx files embedded in my assembly. The messagebox does have one neat thing tho. It includes the standard messagebox icons like the exclamation point and stop sign. To do this, I added gifs of the icons as embedded resources, and included an IHttpHandler which reads the image resources and writes it to the response stream. very nifty... and another reason why I went with handlers instead of external files.

Oh, ya, make that a few more neat things. Both InputBox and MessageBox use system colors on systems that can do it. Under mozilla, it actually looks like a real dialog box, while IE still has a system window border. Oh, and I even did a little guesstimating to try to make sure that the messagebox is always big enough to hold the prompting text you give it.

The only thing i'm not happy with right now is that the dialogs aren't modal. I plan on correcting that in the future, but since it's a big browser-compat problem, I decided to release what I have now, and work on that for v2.

Anyway, I really hope everybody, and especially Jesse, find my version of the dialog control as useful and neat as I did.

Comments

Carson said:

As always Andy - freaking awesome.
# September 16, 2003 12:22 AM

Duncan Smart said:

"...while IE still has a system window border" - do this: have a stylesheet
"body{border:none; overflow:auto;}" - gets rid of the border and only shows scrollbars when they're needed.
# September 16, 2003 4:00 AM

TrackBack said:

# September 16, 2003 11:41 PM

TrackBack said:

Contribute. Extend. Repeat.
# September 17, 2003 12:04 AM

Petr Stahel said:

What about prompt ?
And why you don't use showmodaldialog ?
# September 17, 2003 3:15 AM

Andy Smith said:

"what about prompt"
well, yes, something exists. but it's horrible looking. "Script Prompt" being displayed and all. no built in method has the ability to be as flexible and designable as custom pages.

"showmodaldialog"
window.showModalDialog is an IE-only method. Not only that, but you have to use an IFrame shim to your real page to allow for postbacks with the page it shows. More trouble than it's worth.
# September 17, 2003 3:33 AM

Petr Stahel said:

I can not agree with you, shownodaldialog is great feature (which is missing in Mozzila) ...

And about prompt -
I always prefer use standard functions rather custom one

And why you don't put JS into separate files ?
# September 19, 2003 4:30 AM

Andy Smith said:

"shownodaldialog is great feature"
it's a good feature, which could have been done better. There are serious problems with using it in this context. Maybe I'll use it in the future if I find solutions to those problesm.

"I always prefer use standard functions rather custom one"
And so do I, usually.
But show me how to use validation controls with "prompt".

"And why you don't put JS into separate files ?"
Because asp.net doesn't have a built in way to send embeddded resources as seperate files. And my experience with users is that my email inbox is much less flooded with questions when there is only the 1 assembly file to deal with.
# September 19, 2003 12:24 PM

df said:

df
# November 4, 2003 9:06 AM

Brian Moore said:

Modal Dialog boxes work fine in asp.net if you ad the following line into the <head> section:

<base target="_self">

thats all it takes :)
# February 7, 2004 2:12 PM

Matt Weiner said:

Andy,

I'm a big fan of your work and have had good luck using several of your webcontrols. I'm a surgeon in NYC designing a page to catalog all of the medical devices we use (there are 1000's). I would love to use your dialog box control, but am having trouble with the changes to the web.config file. You mention that adding the reference to the .axd file is necessary. However, my research shows that the <httphandler> section is in the machine.config file, not the web.config file.

I am currently developing on my personal computer and made the change to the machine.config file and still received the same error. Additionally, I will initially be hosting the site through a hosting service, and likely will not have access to the machine.config file.

Can you offer any words of advice?

Thanks,

Matt Weiner, MD
# March 23, 2004 2:05 PM

Ben Gardella said:

I added CausesValidation support to this handy control. You can too!

Just add the following code to the method AddAttributesToRender():

if(this.CausesValidation)
writer.AddAttribute(HtmlTextWriterAttribute.Href, "javascript:{" +
"if (typeof(Page_ClientValidate) != 'function' || Page_ClientValidate())" +
"void(" + dialog.GetDialogOpenScript() + ");}");
else
writer.AddAttribute(HtmlTextWriterAttribute.Href,"javascript:void(" + dialog.GetDialogOpenScript() + ");");
# March 23, 2004 6:20 PM

Amar said:

Hi, Great Controls Andy

Is it possible to allow the dialogs to be minimised? If so can you please let me know how. Thanks
# March 31, 2004 3:58 PM

Peter said:

Are there any complete examples showing how to do dialogs with your controls. I am converting an application to ASP.net and have never used it.
# April 22, 2004 1:03 PM

Tyson said:

I agree with Peter. Are there any complete examples. I am having problems doing simple stuff like settings the title of the dialog. I cant find a property or method to do it in the help file.
# April 29, 2004 7:34 PM

Confused said:

I'm displaying my own aspx page and the Close() event doesn't exist/fire for me. My example looks almost exactly like yours in the downloaded file. AFAIK there is no way to close a browser serverside. What am I missing? Thx!
# May 12, 2004 1:34 PM

Matt said:

I'm using this dialog for a small project I'm working on and discovered a few bugs. First off, because of the way this dialog is designed, it only returns a string to the calling form. That's all well and good for a quick textbox dialog, but for capturing a set of radio buttons, a couple text boxes, and a checkbox or two for something like a popup options pane, a simple string isn't quite good enough. So, instead of reworking the whole library (which is fantastic BTW), I decided to pass back my results as XML. Seems like a perfectly legit use of XML, right? Well, when passing complicated text back from this library, I discovered that the text handling doesn't do proper encoding/decoding. To fix that, change the following code in the downloaded source:

1.) Line 54 of DialogWindowBaseScript.js is <<<eval( theScript.replace('@dialogResult@',result.replace("'", "\\'")) );>>>. This sould be <<<eval( theScript.replace('@dialogResult@', result.replace(/'/g, "\\'")) );>>>. This is a common misunderstanding of the JavaScript function replace(). It takes a regular expression as the first parameter. The way this was written, only the first tick mark gets replaced and subsequent tick marks result in JavaScript errors.

2.) Line 71 of DialogPage.cs is <<<return @"MetaBuilders_DialogWindow_Close('" + results.Replace("'","\\'") + @"');";>>>. It should be <<<return @"MetaBuilders_DialogWindow_Close('" + results.Replace(@"\", @"\\\\").Replace("\r", "\\\\r").Replace("\n", "\\\\n").Replace("'", @"\'") + @"');";>>> to account for backslashes, carriage returns, and line feeds.

3.) Line 184 of DialogWindow.cs is <<<finalUrl.Append(this.ResolveUrl(this.TargetUrl));>>>. It should be <<<finalUrl.Append(this.ResolveUrl(this.TargetUrl.Replace(@"\", @"\\").Replace("'", @"\'").Replace("%", "%25")));>>> so that a DialogOpenLink's TargetUrl doesn't get trampled.

Hope this helps make the dialog more useful for those who want to use it for more than just a toy.
# May 27, 2004 2:34 PM

Andy Smith said:

thanks matt
# May 27, 2004 3:03 PM

Jase said:

Where can you get the download from? And how would you go about using this control? I'm a newb at ASP.NET, but am very interested in learning how to do this stuff...
# June 30, 2004 4:47 PM

Joe said:

I had a problem with the dialog windows where on IE if many browser windows were open (browser windows set to any page) and a user used my app and tried to open up the dialog windows...it took 10-15 seconds to load. This was a real problem for me since many users always had many windows open. I finally got the solution:

DialogWindowBaseScript.js change the first function where it says:

window.MetaBuilders_DialogWindow_CurrentDialog = window.open(url, name, features);

to

window.MetaBuilders_DialogWindow_CurrentDialog = window.open(url, "", features);

The only change here was not passing the name of the control. It seems the browser is a bit confused with the control that seems to exist on the page already. The second I made this change all was good and it actually was even faster than before (when there were no windows open).

Thanks Andy for this suite!
# July 9, 2004 6:09 PM

hemal said:

i want to set base target value at runtime. when i click on 1 button that should be set out at that time.
# July 16, 2004 5:53 AM

hemal said:

i want to set base target value at runtime. when i click on 1 button that should be set out at that time. Can any one help me in that.
# July 16, 2004 5:56 AM

xMen said:

hi,

im a newbie in asp.net, how do i implement this metabuilder dialogbox with mine?

thanx guys


# July 29, 2004 5:09 AM

TrackBack said:

Ling&#038;Duk &raquo; Great asp.net dialog window control
# January 16, 2005 5:54 PM

Srihari said:

Title of the ModalDialogBox is disappearing when it  posts back?

# May 28, 2007 5:46 AM

toxic said:

Este mensaje, es incomparable)))      

http://www.shampes.com/      

reader

# September 4, 2011 6:26 PM

hooher tod said:

Yes there should realize the reader to RSS my feed to RSS commentary, quite simply

# September 6, 2011 2:03 PM
Leave a Comment

(required) 

(required) 

(optional)

(required)