Home > .net 2.0, AJAX, Visual Studio 2005, Visual Studio 2008 > AJAX Control Toolkit – ModalPopup CSS “bug”?

AJAX Control Toolkit – ModalPopup CSS “bug”?

July 13, 2007

The ModalPopup Control of the AJAX Control Toolkit is great.  It goes a long way to help add some “client” behaviors to web applications and make presenting data very flexible on the web.  I have a few applications that use these to collect data and then return it to the main web page—rather than placing all of the controls right in the face of the user—and it’s gotten rave reviews from our customers.

One “feature” is that you must attach a style to hide the Panel control ({display: none;}) or you’ll see a quick blip of it when the page renders.  Okay, no problem.  But, there’s a catch.

If you embed the style directly on the control, such as:

<asp:Panel ID=”LookupPanel” runat=”server” Style=”display:none;”>

It works like a charm.  However, what if you wanted to be smart and use the CssClass attribute of the Panel object and then define your style in your theme or style sheet?

<asp:Panel ID=”LookupPanel” runat=”server” CssClass=”PopupPanel”>

 

.PopupPanel

{

    width: 500px;

    border: solid 2px #5D7B9D;

    background-color: #F5F5DC;

    padding: 10px 10px 10px 10px;

    display: none;

}

Unfortunately, for some odd reason, that doesn’t work.  Or, perhaps, works too well.  Setting the display style in the stylesheet TOTALLY hides it.  The event activates, but the window never appears.  You can define all other style attributes in your style sheet but leave the display attribute right on the control.  It’s a bit annoying, but still works like a champ.  I’d love to know if this is a “feature” or just simply an issue with how it hides/shows the window… input?

  1. No comments yet.
  1. August 14, 2007 at 3:19 pm
Comments are closed.
%d bloggers like this: