Solved

How to itereate through repeater control itemtemplate data using Javascript?

Posted on 2007-11-18
3
2,306 Views
Last Modified: 2013-11-07
Using asp.net 2 (VB).  
I have two controls in place.
1.  An ASP.NET repeater conrol with a string (image path) as part of the Item Template (first element of each row).
2.  A client side javascript image carousel control which requires that string for population. The client side caradd function is already written.

This seems like a simple thing but....  I'd like to either:
1.   Call the carradd javascript upon every itemTemplate itemcreated
2.  Iterate through the completed repeater control, extract the needed string and feed it to the client side function.

I understand that this should probably be done with AJAX but I'm not quite ready to tackle that this week so....

Thank you.
0
Comment
Question by:RichardKline
3 Comments
 
LVL 63

Assisted Solution

by:Zvonko
Zvonko earned 100 total points
ID: 20309538
Show that JavaScript function. It surely needs changes to get the images as parameters from every image in rows. Also state what that function should do on multiple images, change them all at let say one second interval? Chnage randomly one of many images at interval?
0
 
LVL 16

Accepted Solution

by:
McExp earned 400 total points
ID: 20309662
I know you didn't want to involve AJAX in your solution. However, and I make no apologies for this, I would really recomend looking at AJAX, specifically the SlideShowExtender Control in the ASP.NET AJAX Control Toolkit (http://asp.net/AJAX/AjaxControlToolkit/Samples/SlideShow/SlideShow.aspx). It really is simple!

-- WebService method to provide the list to loop --
    <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("images/Blue hills.jpg", "Blue Hills", "Go Blue"),
            new AjaxControlToolkit.Slide("images/Sunset.jpg", "Sunset", "Setting sun"),
            new AjaxControlToolkit.Slide("images/Winter.jpg", "Winter", "Wintery..."),
            new AjaxControlToolkit.Slide("images/Water lilies.jpg", "Water lillies", "Lillies in the water"),
            new AjaxControlToolkit.Slide("images/VerticalPicture.jpg", "Sedona", "Portrait style picture")};
        }
    </script>

-- Items to be in body of page --
        <asp:ScriptManager ID="ScriptManager1" runat="server" />
        <div style="text-align:center">
            <asp:Image ID="Image1" runat="server"
                Height="300"
                Style="border: 1px solid black;width:auto"
                ImageUrl="~/SlideShow/images/Blue hills.jpg"
                AlternateText="Blue Hills image" />
            <asp:Label runat="Server" ID="imageLabel1"/><br /><br />
            <asp:Button runat="Server" ID="prevButton" Text="Prev" Font-Size="Larger" />
            <asp:Button runat="Server" ID="playButton" Text="Play" Font-Size="Larger" />
            <asp:Button runat="Server" ID="nextButton" Text="Next" Font-Size="Larger" />
            <ajaxToolkit:SlideShowExtender ID="slideshowextend1" runat="server"
                TargetControlID="Image1"
                SlideShowServiceMethod="GetSlides"
                AutoPlay="true"
                ImageDescriptionLabelID="imageLabel1"
                NextButtonID="nextButton"
                PlayButtonText="Play"
                StopButtonText="Stop"
                PreviousButtonID="prevButton"
                PlayButtonID="playButton"
                Loop="true" />

Hopefully you can see from the code above that it's really not that complicated. I can assure you it will take less time to understand and impliment this that it will to engineer a solution the hard way.
0
 
LVL 1

Author Comment

by:RichardKline
ID: 20309841
I give -- AJAX it is.  Perhaps I'll get out that book I purchased.
The extender which McExp references will get me past my immediate hurdle.  
Ultimately, I plan to use Bill Scott's carousel (http://billwscott.com/carousel/ ) which does some really cool things over and beyond the extender.   He also provides an AJAX data source example using PHP (which I want to get involved with right now even less than AJAX).

Thanks to Zvonko for his input.   I'm not sure that his immediate concern is correct (though it certainly may!) but his question made me re-examine my initial beliefs -- kludging an interface might not be as easy as I first thought.
0

Featured Post

Master Your Team's Linux and Cloud Stack!

The average business loses $13.5M per year to ineffective training (per 1,000 employees). Keep ahead of the competition and combine in-person quality with online cost and flexibility by training with Linux Academy.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

This article will give core knowledge of JavaScript and will head in to your first JavaScript program. I am Durvesh Naik and I am here to deal with this series of JavaScript. I will teach you JavaScript in part wise , as its quite boring to read big…
Having worked on larger scale sites, we found out that you are bound to look at more scalable solutions to integrating widgets, code snippets or complete applications and mesh them into functional sites, in any given composition. To share some of…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

821 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question