Ajax Slideshow

Kerensky18 · June 1st, 2008, 09:44 AM

I'm having trouble getting the slideshow to work. I'm designing the webpage for school. Any help would be appriciated.

The slideshow does not work only the default image is displayed. I've tried using a webservice to do the coding as well but it also did not work.

Here is the web code.

<%@ Page Language="VB" AutoEventWireup="false" CodeFile="Default.aspx.vb" Inherits="_Default" %>

<%@ Register assembly="System.Web.Extensions, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35" namespace="System.Web.UI" tagprefix="asp" %>

<%@ Register assembly="AjaxControlToolkit" namespace="AjaxControlToolkit" tagprefix="cc1" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Untitled Page</title>
    <link href="StyleSheet.css" rel="stylesheet" type="text/css" />
</head>
<body>
    <form id="form1" runat="server">
    <div>
      <asp:ScriptManager ID="ScriptManager1" runat="server">
      </asp:ScriptManager>
    </div>
     <div id="wrap"> <div id="screen">
            <div id="header">
            <h1>Royal Oaks Country Club</h1>

            </div>

         <div id= "sidebar">
         </div>

         <div id = "main">
         <div class = "entry">
            <p> Welcome to the Royal Oaks Country Club a fine establishment located 40 miles out of Seattle on the beautifl pacific coasline.</p>

         </div>

           <cc1:SlideShowExtender ID="SlideShowExtender1" runat="server"
                   TargetControlID="Image1"
                   UseContextkey ="True"
                   PreviousButtonID="PrevButton"
                   PlayButtonID = "PlayButton"
                   NextButtonID="NextButton"
                   AutoPlay="true"
                   Loop ="true" SlideShowServiceMethod = "GetSlides"
                   >
                   </cc1:SlideShowExtender>

           <asp:Image ID="Image1" runat="server"
           imageurl ="slideshow/dining_top.jpg"/>
             <asp:Button ID="PrevButton" runat="server" Text="Prev" />
             <asp:Button ID="PlayButton" runat="server" Text="Play" />
             <asp:Button ID="NextButton" runat="server" Text="Next" />

         </div>

        <div id="footer">
        <p> This webpage created by Jason Pollard on June 1, 2008</p>
        </div>

        </div></div>
    </form>
</body>
</html>

Here is the app code:

Partial Class _Default
    Inherits System.Web.UI.Page
    Partial Class SlideShowExtender
        Inherits System.Web.UI.Page

        <System.Web.Services.WebMethodAttribute()> _
        <System.Web.Script.Services.ScriptMethodAttribute( )> _
        Public Shared Function GetSlides(ByVal contextKey As System.String) _
            As AjaxControlToolkit.Slide()

            Return New AjaxControlToolkit.Slide() { _
            New AjaxControlToolkit.Slide("slideshow/dining_top.jpg", "Dining", "Dining"), New AjaxControlToolkit.Slide("slideshow/golf 1.jpg", "Golf 1", "Golf 1")}

        End Function
    End Class
End Class

joefawcett · June 1st, 2008, 10:21 AM

So what's the problem? Is there an error message or what?

--

Joe (Microsoft MVP - XML)

Kerensky18 · June 1st, 2008, 10:42 AM

That's whats frustrating me I'm not getting an error.
It's just not running the slide show.

joefawcett · June 1st, 2008, 12:29 PM

Okay, my VB's a bit shaky but I've got the example to work:

Code:

Partial Class _Default
    Inherits System.Web.UI.Page
    Partial Class SlideShowExtender
        Inherits System.Web.UI.Page

        <System.Web.Services.WebMethodAttribute()> _
        <System.Web.Script.Services.ScriptMethodAttribute()> _
        Public Shared Function GetSlides(ByVal contextKey As System.String) _
            As AjaxControlToolkit.Slide()

            Return New AjaxControlToolkit.Slide() { _
            New AjaxControlToolkit.Slide("slideshow/dining_top.jpg", "Dining", "Dining"), New AjaxControlToolkit.Slide("slideshow/golf 1.jpg", "Golf 1", "Golf 1")}

        End Function
    End Class
End Class

this look's a bit iffy, why have the nested classes? I changed it to

Code:

Partial Class _Default
  Inherits System.Web.UI.Page
  <System.Web.Services.WebMethodAttribute()> _
<System.Web.Script.Services.ScriptMethodAttribute()> _
Public Shared Function GetSlides(ByVal contextKey As String) As AjaxControlToolkit.Slide()

    Return New AjaxControlToolkit.Slide() { _
    New AjaxControlToolkit.Slide("Images/BillGates2.jpg", "Bill Gates", "Bill Gates"), _
    New AjaxControlToolkit.Slide("Images/BegXml4.jpg", "Beginning XML", "Beginning XML"), _
    New AjaxControlToolkit.Slide("Images/ProWeb2.0.jpg", "Professional Web 2.0", "Professional Web 2.0")}

  End Function
  <System.Web.Services.WebMethodAttribute()> _
  <System.Web.Script.Services.ScriptMethodAttribute()> _
    Public Shared Function GetSlides() As AjaxControlToolkit.Slide()
    Return New AjaxControlToolkit.Slide() { _
      New AjaxControlToolkit.Slide("Images/BillGates2.jpg", "Bill Gates", "Bill Gates"), _
      New AjaxControlToolkit.Slide("Images/ProWeb2.0.jpg", "Professional Web 2.0", "Professional Web 2.0"), _
      New AjaxControlToolkit.Slide("Images/BegXml4.jpg", "Beginning XML", "Beginning XML")}
  End Function
End Class

You don't need to implement both versions but I wanted to try it. (Obviously I changed the images to some I had :)

If you want the original image to feature in the show then you must add it again to the GetSlides method.
I also used a ToolkitScriptManager which may not be completely necessary but is better practice when using the Ajax Control Toolkit

(If you want the VS solution email me your address and I'll send it to you.)

--

Joe (Microsoft MVP - XML)