Im trying to implement JCarousel in my site and have some confusion about what to do, I have two files, one called similar_products_stack which contains the query from my database and passes it onto similar_products where the carousel is supposed to be generated.

Code:
<?php
 
$similar_items = array();
 
$category_in_now = zen_get_products_category_id($_GET['products_id']);
 
for($i=0;$i<4;$i++) {
		$products_query_raw = "SELECT p.products_id, p.products_type, pd.products_name, p.products_image, p.products_price, p.products_model, p.manufacturers_id,
		                       p.master_categories_id
		                       FROM " . TABLE_PRODUCTS . " p
		                       LEFT JOIN " . TABLE_MANUFACTURERS . " m
		                       ON (p.manufacturers_id = m.manufacturers_id), " . TABLE_PRODUCTS_DESCRIPTION . " pd
		                       WHERE p.products_status = 1 
		                       AND p.products_id = pd.products_id
		                       AND p.master_categories_id = :catInNow  ORDER BY rand() LIMIT 0,4";
 
		$products_query_raw = $db->bindVars($products_query_raw, ':catInNow', $category_in_now, 'integer');
		$result = $db->Execute($products_query_raw);
 
 
		if ($result->RecordCount() > 0) {
			$item =  '<li class=itemProduct">'
			. '<div id="itemBox">'
			. '<a href="' . zen_href_link('product_info', 'cPath=' . $cPath .  '&products_id=' . $result->fields['products_id']) . '">'
			. zen_image(DIR_WS_IMAGES . $result->fields['products_image'], $result->fields['products_name'], SMALL_IMAGE_WIDTH, SMALL_IMAGE_HEIGHT)
			. '</a>'
			. '<span class="prodManufact">'
			. zen_get_products_manufacturers_name($result->fields['products_id'])
			. '</span>'
			. '<span class="prodModel">'
			. $result->fields['products_model']
			. '</span>'
			. '<span class="curPrice">'
			. zen_get_products_display_price($result->fields['products_id'])
			. '</span>'
			. '</div>'
			. '</li>';
			array_push($similar_items,$item);
		}
 
}
 echo $similar_items;
 ?>
I copied this part from the examples, its loading the carousel but it doesn't load anything inside it, Im pretty sure it has to do with the call back functions but I dont know how to fix them.

Code:
function mycarousel_itemLoadCallback(carousel, state)
{
    // Check if the requested items already exist
    if (carousel.has(carousel.first, carousel.last)) {
        return;
    }
 
    jQuery.get(
        'tpl_similar_products_stack.php',
        {
            first: carousel.first,
            last: carousel.last
        },
        function(xml) {
            mycarousel_itemAddCallback(carousel, carousel.first, carousel.last, xml);
        },
        'xml'
    );
};
 
function mycarousel_itemAddCallback(carousel, first, last, xml)
{
    // Set the size of the carousel
    carousel.size(parseInt(jQuery('total', xml).text()));
 
    jQuery('item', xml).each(function(i) {
        carousel.add(first + i, mycarousel_getItemHTML(jQuery(this).text()));
    });
};
 
/**
 * Item html creation helper.
 */
function mycarousel_getItemHTML(url)
{
    return 'item';
};
 
jQuery(document).ready(function() {
    jQuery('#mycarousel').jcarousel({
        // Uncomment the following option if you want items
        // which are outside the visible range to be removed
        // from the DOM.
        // Useful for carousels with MANY items.
 
        // itemVisibleOutCallback: {onAfterAnimation: function(carousel, item, i, state, evt) { carousel.remove(i); }},
        itemLoadCallback: mycarousel_itemLoadCallback
    });
});
 
</script>
 
  <div id="mycarousel" class="jcarousel-skin-ie7">
    <ul>
      <!-- The content will be dynamically loaded in here -->
    </ul>
  </div>