Home > AJAX > AJAX Modal Popup with Ajax Slide Show

AJAX Modal Popup with Ajax Slide Show


Hi

try this example to open Modal Popup Extender with AJAX Slide Show Extender

<%@ Page Language="C#" %>

<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "<a href="http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd</a>">

<script runat="Server" type="text/C#">
    [System.Web.Services.WebMethod]
    [System.Web.Script.Services.ScriptMethod]
    public static AjaxControlToolkit.Slide[] GetSlides()
    {
        return new AjaxControlToolkit.Slide[] {
            new AjaxControlToolkit.Slide("SlideShow/images/Sunset.jpg", "Sunset", "Setting sun"),
            new AjaxControlToolkit.Slide("SlideShow/images/Winter.jpg", "Winter", "Wintery..."),
            new AjaxControlToolkit.Slide("SlideShow/images/Water lilies.jpg", "Water lillies", "Lillies in the water"),
            new AjaxControlToolkit.Slide("SlideShow/images/VerticalPicture.jpg", "Sedona", "Portrait style picture")};
    }
</script>

<html xmlns="<a href="http://www.w3.org/1999/xhtml">http://www.w3.org/1999/xhtml</a>">
<head runat="server">
    <title></title>
    <script type="text/javascript">
        function getid() {
            var id = $get("Image1").src;
            alert(id);
        }
        function Button1_onclick() {
            $find("Panel1").show();
        }

        function Button2_onclick() {
            $find("Panel1").hide();
        }

    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <cc1:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server">
        </cc1:ToolkitScriptManager>
        <asp:Panel ID="Panel1" runat="server" Height="311px" Width="321px">
        <asp:Image ID="Image1" runat="server" Height="300" Style="border: 1px solid black;
            width: auto" onclick="getid();" />
        <cc1:SlideShowExtender ID="slideshowextend1" runat="server" TargetControlID="Image1"
            BehaviorID="ss1" SlideShowServiceMethod="GetSlides" PlayInterval="1000" AutoPlay="true"
            Loop="true" />
            <br />
            <asp:Button ID="Button2" runat="server" Text="Close" />
            </asp:Panel>
        <cc1:ModalPopupExtender ID="Panel1_ModalPopupExtender" runat="server"
            DynamicServicePath="" Enabled="True" PopupControlID="Panel1" BehaviorID="Panel1" TargetControlID="Panel1" OkControlID="Button2">
        </cc1:ModalPopupExtender>
    </div>
    </form>
    <p>
        <input id="Button1" type="button" value="button" onclick="return Button1_onclick()" /></p>
</body>
</html>

 Hope this helps

Good Luck

Advertisements
Categories: AJAX
  1. No comments yet.
  1. No trackbacks yet.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: