in

Blog By Bob

Blog by Bob

ASP.NET and Modal Forms, or, the Good, the Bad and the Ugly

I mentioned earlier that I ran into some interesting behaviors while making a web application for work. I've discussed them with various 'web folken', because if you ask anyone who knows me, you will find out I am more of a WinForms kinda guy, versus WebForms. Hopefully this will change since I am working on a smartclient application now, so hopefully I will become more of a SmartClient kind of guy...

Anyhow, I decided some sample code would be best, you know, for those that want to play along. Noone would say that I don't play well with others...well, actually most would say that, but I don't believe them.

When I first ran into some of these issues and brought up my concerns with the web guys, I was basically told that I was thinking too much like Mr. WinForms and not enough like Mr. ASP.NET, and that ASP.NET was not designed to behave in a manner appropriate to modal form usage. Now, all design issues aside, and whether or not modal forms were the best choice in my application(which I believe it was), the issue I have with that line of thinking is that ASP.NET is a tool for me to use to create web applications. A tool should not be a limitation to what I am able to do, it should be an extension of my will. It should allow me to do things I could not do without the tool.

Ok, so the first thing we are going to do, obviously, is open up Visual Studio and start a new ASP.NET web project. We aren't going to think about any refactoring or coding standards, we are just going to try to get our learn on.

Add a second web form to the project, and we'll just leave it called WebForm2. In WebForm1 add the following routine.

public void DisplayModalForm(string url, string options)

  RegisterStartupScript(Guid.NewGuid().ToString()," var w=window.showModalDialog(\""+url+"\",null,\""+options+"\"); ");

var w=window.showModalDialog(\""+url+"\",null,\""+options+"\");document.Form1.submit();

}

The reason for this snippet of code is that there isn't any real way to launch the modal form from server side ASP.NET, so we are going to use javascript to do it. Using RegisterStartupScript() allows us to at least keep the creation of the the javascript in our code behind, and because most people do not like to manually edit the HTML code that Visual Studio creates.

Add a button to WebForm1 and add the following line to the Click event.

DisplayModalForm("WebForm2.aspx","scrollbars:no;toolbar:no;location:no;menubar:no;status:no;titlebar:no;resizable:yes;dialogWidth:700px;dialogHeight:600px");

Now for one of the oddities. Add a button on WebForm2 and launch the project. Click the button on WebForm2. Huh, I bet you didn't expect that now did you? When the modal form posts back, it does so by launching a new browser window instead of posting back to itself as normal. The remedy? It isn't pretty but it works.

Add a third form to the project, once again keeping the default WebForm3 name. Take the button off of WebForm2 and change the html, adding the following line between the form tags.

<IFRAME src="”WebForm3.aspx”" width="100%" height="100%" />

Add a button to WebForm3 and relaunch the application. You will notice that the form posts back into the frame now, so no new window is opened. To close the form, add the following to the Click event of WebForm3.

RegisterStartupScript(Guid.NewGuid().ToString()," window.close(); ");

One of things I ran into that may or may not be of interest is when the modal form closed, I wanted to be able to post the main form back, the modal form was entering data that needed to be refreshed on the main page. This is actually pretty easy to do in retrospect, though it took awhile for me to find the answer. Remember, I never professed to be a web guy. Change the DisplayModalForm routine to the following.

public void DisplayModalForm(string url, string options)

{

  RegisterStartupScript(Guid.NewGuid().ToString()," var w=window.showModalDialog(\""+url+"\",null,\""+options+"\");document.Form1.submit(); ");

}

You'll notice that the code is the same, with the exception of the addition of the document.Form1.Submit(), which fires when execution resumes in the main form after the modal form closes, and reloads the main form to refresh the data.

Who says ASP.NET doesn't like modal forms? Granted the code isn't the most straight forward type of solution, but it is very little code, and the code that was added was pretty straight forward. The only real disappointment is the necessary inclusion of an additional container form to hold our modal form from 'posting out'. I don't know what to blame that on, I would have to assume it is a behavioral issue with the .NET framework itself, but I don't have enough information yet to make that accusation.

I don't mind a little additional work in order to have the advantages of modal forms, where appropriate. I know some programmers don't like modal forms, but it allowed my application to always stay on the main page, and to control data entry with out worry about page navigation disruptions. I think adding the modal form code was significantly easier than trying to control the application flow and most likely more consistent for that specific application, as well as allowing the application's user interface to be very neat and clean.

Are modal forms always the best solution? Obviously not, but they shouldn't be ignored when they are.

Published Dec 18 2004, 09:18 PM by Bob

Comments

No Comments

Leave a Comment

(required)  
(optional)
(required)  
Add
Copyright © :: BlogByBob.com
Powered by Community Server (Non-Commercial Edition), by Telligent Systems