Modal Window When Clicking Link Button

Question

I have a LinkButton inside a data list. When I click on this LinkButton, I want to open a modal window 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

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 3

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>