Load pictures with PHP (from DB) dynamicly in JavaScript AJAX script (jCarousel)

Question

Hello everyone, I am using a AJAX gallery called jCarousel, and I am having some difficulties about dynamicly loading my pictures from the data, I simply don’t know how to integrate PHP in the JavaScript code. The static JavaScript code for loading the pictures is:

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\"}
];

Now, I have tried just to create a “load image” function in PHP and of cause I can just echo this entire expression but my two problems is: How do I combine PHP and JavaScript and, if you notice the last image, it don’t have an comma (“,”) behind it. So my question is, firstly how do I insert a PHP code / function inside this JavaScript so it query and get the images and titles directly from the database, and how do I make sure, that the last image in the array doesn’t have an comma (“,”) at the end so the code can look like this when written to the browser.

Thanks in advance - Emil

Answer 1

Your going to need to learn a bit of PHP to do the query, the way to do the comma is put all the elements into an Array and

$string = IMPLODE(', ', $arrayVar);