Modal Window When Clicking Link Button

Question

Hi all,

I have a LinkButton inside a data list. When I click on this LinkButton, I want to open a modal widow and load another html page in it.

Can you guys please help me with this?

Answer 1

You should check out a jQuery plugin like Thickbox, which I've used to do exactly what you've described.

Answer 2

How to ask questions the smart way

Answer 3

hi check ModalPopupExtender....It's a component of Ajax Control toolkit. First download it from from CodePlex ....and when you add reference the *Binary.dll to your project...you can use it within your pages.

Answer 4

I have always been a big fan of YUI, they have great documentation and Examples showing how to set things up. [ i love jQuery too ].

Look at YUI's Container Objects. They have very slick skinable Modal Panels:

http://developer.yahoo.com/yui/container/panel/

Here is a simple example:

http://developer.yahoo.com/yui/examples/container/panel-loading.html

Server Side

button.Attributes.Add("click", "popModal");

Client Side

<script>
    function popModal(e) {
        // Initialize the temporary Panel to display while waiting for external content to load
        var SavingPanel =
                        new YAHOO.widget.Panel("wait",
                         { width: "240px",
                             fixedcenter: true,
                             close: false,
                             draggable: false,
                             zindex: 1000,
                             modal: true,
                             visible: true
                         }
                        );

        SavingPanel.setHeader("Saving, please wait...");
        SavingPanel.setBody('<img src="http://l.yimg.com/a/i/us/per/gr/gp/rel_interstitial_loading.gif"  />');
        SavingPanel.render(document.body);

    }
</script>