[jQuery] Re: Dynamic loading of PHP array into jCarousel?

[Steve Finkelstein]

Hi thanks for the reply Ted. :-)

I got around to figuring this out last night. I built my JavaScript
array using server-side data.  Still has some work but I got an
example page up that's working:

http://devel.phpgeek.org/inventory/single/10

- sf

On 9/16/07, Theodore Ni <[EMAIL PROTECTED]> wrote:
> That example is dynamic in the sense that you can populate that Javascript
> array in many different ways. For example, you could take in user input and
> create an array, or you can let your PHP echo out a Javascript array.
>
> For dynamic in the sense that we use AJAX to pull data and then create the
> carousel, a simple example would be
> http://sorgalla.com/projects/jcarousel/examples/dynamic_javascript.html
>
> Notice in each of the examples you still need to write your own function to
> parse whatever data/string you return from the server. The example in the
> link I gave you used jQuery.get() to pull a simple page
> http://sorgalla.com/projects/jcarousel/examples/dynamic_ajax.txt
> which just has some image URLs separated by a | character. The functions in
> the page then separate the individual URLs and add them into the carousel.
>
> You only need something like this on your server side after you get your
> item array $photos from the database (in fact, you could do this in your
> while loop if you are using one to pull data):
>
> $photo_src = array();
> for ($i = 0, $l = count($photos); $i < $l; $i++) {
>     $photo_src[] = $photos['photo_id'] . '.jpg';
> }
> $photo_string = implode('|', $photo_src);
> echo $photo_string;
>
> Then, just replace dynamic_ajax.txt in the sample code with
> your_php_page.php
>
>
> On 9/15/07, Steve Finkelstein <[EMAIL PROTECTED]> wrote:
> >
> > Hi all,
> >
> > I'm a bit confused trying to understand sources on dynamic loading of
> > images into a jCarousel object.  The issue here is the JavaScript
> > array is already populated by page load, and obviously I can't see how
> > server-side data was used to populate it. I'm a bit novice when it
> > comes to this, but could certainly use some help.  An example
> > JavaScript array taken from the example sites include:
> >
> > var mycarousel_itemList = [
> >     {url:
> "http://static.flickr.com/66/199481236_dc98b5abb3_s.jpg";,
> > title: "Flower1"},
> >     {url: "
> http://static.flickr.com/75/199481072_b4a0d09597_s.jpg";,
> > title: "Flower2"},
> >     {url:
> "http://static.flickr.com/57/199481087_33ae73a8de_s.jpg ",
> > title: "Flower3"},
> >     {url:
> "http://static.flickr.com/77/199481108_4359e6b971_s.jpg";,
> > title: "Flower4"},
> >     {url:
> "http://static.flickr.com/58/199481143_3c148d9dd3_s.jpg";,
> > title: "Flower5"},
> >     {url: "
> http://static.flickr.com/72/199481203_ad4cdcf109_s.jpg";,
> > title: "Flower6"},
> >     {url:
> "http://static.flickr.com/58/199481218_264ce20da0_s.jpg ",
> > title: "Flower7"},
> >     {url:
> "http://static.flickr.com/69/199481255_fdfe885f87_s.jpg";,
> > title: "Flower8"},
> >     {url:
> "http://static.flickr.com/60/199480111_87d4cb3e38_s.jpg";,
> > title: "Flower9"},
> >     {url: "
> http://static.flickr.com/70/229228324_08223b70fa_s.jpg";,
> > title: "Flower10"}
> > ];
> >
> > Maybe I'm confused with the sense of 'dynamic' here, but I need to
> > load all images that I populate from a table in my database. A dump of
> > this array might look like this:
> >
> >     [0] => Array
> >         (
> >             [photo_id] => 2
> >             [vehicle_id] => 1
> >             [caption] =>
> >             [position] => 2
> >             [cars_com] => 0
> >             [autotrader_com] => 0
> >         )
> >
> >     [1] => Array
> >         (
> >             [photo_id] => 4
> >             [vehicle_id] => 1
> >             [caption] =>
> >             [position] => 4
> >             [cars_com] => 0
> >             [autotrader_com] => 0
> >         )
> >
> > At which point 2.jpg and 4.jpg are the photos I need to load.
> >
> > Thank you for any insight into how I can solve this problem.
> >
> > - sf
> >
>
>
>
> --
> Ted