locked
Slideshowextender Button RRS feed

  • Question

  • User-1835835255 posted

    How do you run an onclick codebehind function for an asp.net button (btnNext).  When the button is setup for a slideshowextender, the onclick event does not work.

    Friday, December 6, 2013 2:31 PM

Answers

  • User1734617369 posted

    Hi,

    Here is an example on how you can do it, but this will break the functionality of the SlideShowExtender a bit, so I would recomend not doing it with the click event but rather calling a web method to do what you would like to do:

    <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm2.aspx.cs" Inherits="WebApplication7.WebForm2" %>
    
    <%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="asp" %>
    
    <!DOCTYPE html>
    
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <title></title>
        <script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-2.0.3.min.js"></script>
    </head>
    <body>
        <form id="form1" runat="server">
            <asp:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server"></asp:ToolkitScriptManager>
            <asp:UpdatePanel ID="UpdatePanel1" runat="server">
                <ContentTemplate>
                    <asp:Image ID="Image1" runat="server" />
                    <div>
                        <asp:Button ID="Button1" runat="server" Text="On" />
                        <asp:SlideShowExtender ID="SlideShowExtender1" PlayButtonID="Button1" NextButtonID="btnNext" AutoPlay="true" StopButtonText="Stop" Loop="true" SlideShowAnimationType="FadeInOut" SlideShowServiceMethod="GetSlides" TargetControlID="Image1" runat="server"></asp:SlideShowExtender>
                    </div>
                    <asp:Label Text="" ID="Label1" runat="server" />
                </ContentTemplate>
            </asp:UpdatePanel>
            <asp:Button Text="Next" ID="btnNext" runat="server" />   
            <script>
                $(document).ready(function () {
                    endRequestHandler();
                });
    
                Sys.WebForms.PageRequestManager.getInstance().add_endRequest(endRequestHandler);
    
                function endRequestHandler() {
                    $('#btnNext').click(function () {
                    <%=Page.ClientScript.GetPostBackEventReference(btnNext, "") %>
                    return true;
                });
            };
        </script>
        </form>    
    </body>
    </html>

    Best regards
    Johan

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Sunday, December 8, 2013 10:43 AM

All replies

  • User1734617369 posted

    Hi,

    Here is an example on how you can do it, but this will break the functionality of the SlideShowExtender a bit, so I would recomend not doing it with the click event but rather calling a web method to do what you would like to do:

    <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm2.aspx.cs" Inherits="WebApplication7.WebForm2" %>
    
    <%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="asp" %>
    
    <!DOCTYPE html>
    
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <title></title>
        <script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-2.0.3.min.js"></script>
    </head>
    <body>
        <form id="form1" runat="server">
            <asp:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server"></asp:ToolkitScriptManager>
            <asp:UpdatePanel ID="UpdatePanel1" runat="server">
                <ContentTemplate>
                    <asp:Image ID="Image1" runat="server" />
                    <div>
                        <asp:Button ID="Button1" runat="server" Text="On" />
                        <asp:SlideShowExtender ID="SlideShowExtender1" PlayButtonID="Button1" NextButtonID="btnNext" AutoPlay="true" StopButtonText="Stop" Loop="true" SlideShowAnimationType="FadeInOut" SlideShowServiceMethod="GetSlides" TargetControlID="Image1" runat="server"></asp:SlideShowExtender>
                    </div>
                    <asp:Label Text="" ID="Label1" runat="server" />
                </ContentTemplate>
            </asp:UpdatePanel>
            <asp:Button Text="Next" ID="btnNext" runat="server" />   
            <script>
                $(document).ready(function () {
                    endRequestHandler();
                });
    
                Sys.WebForms.PageRequestManager.getInstance().add_endRequest(endRequestHandler);
    
                function endRequestHandler() {
                    $('#btnNext').click(function () {
                    <%=Page.ClientScript.GetPostBackEventReference(btnNext, "") %>
                    return true;
                });
            };
        </script>
        </form>    
    </body>
    </html>

    Best regards
    Johan

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Sunday, December 8, 2013 10:43 AM
  • Sunday, December 8, 2013 10:45 PM