2012-06-20 2 views
1

Je travaille avec un script de magasinage qui permet de charger de nouveaux produits sur la même page lorsque vous cliquez en bas de l'écran, comme Facebook, etc. Il est possible d'obtenir une chaîne AJAX pour chaque page lorsque vous appelez le page comme page1.ajax ou page2.ajax. J'ai lu de nombreux articles et tutoriels mais je n'arrive pas à comprendre celui-ci.charger plus avec jquery et une chaîne ajax?

Ce que j'ai à ce jour est:

HTML

<div id="collection-ajax"> 
    <div class="productsGrid"> 
    // products on page 1 // 
    </div> 
    // WHEN CATEGORIE HAS MORE PAGES THIS HAVE TO BE SHOWN AFTER THE PRODUCTS ABOVE 
    <div id="loadmoreajaxloader" style="display:none;"><img src="ajax-loader.gif" /></div> 

La chaîne AJAX (ressemble JSON) et est un produit le reste, je laisse loin:

{"page":1,"pages":2,"count":42,"url":"http:\/\/meules1.webshopapp.com\/woonkamer-en-keuken\/","products":[{"id":1750137,"vid":2765003,"image":"http:\/\/cdn.webshopapp.com\/i\/z1faly\/50x50x2\/newc.jpg","image_id":2156769,"brand":false,"code":"40-95407","ean":"40-95407","sku":"","score":false,"price":{"price":65,"price_money":"\u20ac65,00","price_money_with_currency":"\u20ac65,00 EUR","price_money_without_currency":"65,00","price_excl":54.6218,"price_excl_money":"\u20ac54,62","price_excl_money_with_currency":"\u20ac54,62 EUR","price_excl_money_without_currency":"54,62","price_incl":65,"price_incl_money":"\u20ac65,00","price_incl_money_with_currency":"\u20ac65,00 EUR","price_incl_money_without_currency":"65,00","price_old":109,"price_old_money":"\u20ac109,00","price_old_money_with_currency":"\u20ac109,00 EUR","price_old_money_without_currency":"109,00","price_old_excl":91.5966,"price_old_excl_money":"\u20ac91,60","price_old_excl_money_with_currency":"\u20ac91,60 

Le Jquery est le problème auquel je suis confronté. Personnellement, j'ai pensé quelque chose comme ceci:

<script type="text/javascript"> 
var collectionPage = {{ collection.page }}; 
var collectionPages = {{ collection.pages }}; 

function loadCollectionContent(){ 
    if(collectionPage < collectionPages){ 
     collectionPage++; 

     var url = 'http://shop.com/page' + collectionPage + '.ajax'; 

     $.getJSON(url, function(data){ 
      var listItems = []; 
      $.each(data.products, function(index, product){ 
       var itemHtml = '' 
       // HERE I'M STUCK ON WHAT TO DO NEXT 

Quelqu'un peut-il me diriger vers certaines directions? Ou m'aider avec le code? Si vous avez besoin de plus d'info laissez-moi savoir.

+0

vous pouvez faire quelque chose comme ça. – vijay

+0

@vj shah: Vous voulez dire que mon approche serait bonne? – Meules

+0

ouais..travailler un peu plus.Elle peut aussi suivre l'autre. – vijay

Répondre

2

vous pouvez faire quelque chose comme ça aussi.

$("loadmoreajaxloader").click(function(){ 
    //on clicking the bottom of page or whatever div you want 
$.ajax({ 
    url:database_more.pl //fetch data 
    success:function(data){ 
     $("loadmoreajaxloader").html(data); 
//embed it in the current page whatever you obtain 
    } 
    }); 
}); 

Espérons que cela aide. Pourtant, c'est différent de votre approche.

Merci.