चहचहाना गतिशील हिंडोला

Question

बूटस्ट्रैप मैं (उदाहरण के लिए, खोज परिणामों के लिए) बूटस्ट्रैप के हिंडोला उपयोग करने के लिए गतिशील रूप से सामग्री के माध्यम से स्क्रॉल करने के लिए करना चाहते हैं। इसलिए, मुझे नहीं पता कि सामग्री के कितने पेज होंगे, और मैं बाद के पृष्ठ को नहीं लेना चाहता हूं जब तक कि उपयोगकर्ता अगले बटन पर क्लिक न करे।

मैंने इस प्रश्न को देखा: Carousel with dynamic content, लेकिन मुझे नहीं लगता कि उत्तर लागू होता है क्योंकि ऐसा लगता है कि यह एक डीबी सर्वर पक्ष से सभी सामग्री (उस मामले में छवियों) को लोड करने का सुझाव देता है और सबकुछ स्थिर सामग्री के रूप में देता है।

मेरे सर्वोत्तम अनुमान, पेज बटन प्रेस पर क्लिक करें घटना रोकना खोज परिणामों के अगले पृष्ठ के लिए ajax कॉल करते हैं, प्रभावी रूप से अपडेट करने के लिए जब ajax कॉल रिटर्न, तो हिंडोला के लिए एक स्लाइड घटना उत्पन्न है। लेकिन बूटस्ट्रैप पृष्ठों पर इनमें से कोई भी वास्तव में चर्चा या दस्तावेज नहीं है। कोई विचार स्वागत है।

Answer 1

आप (या किसी और) अभी भी इस पर एक समाधान की तलाश में है, मैं समाधान .. मैं बूटस्ट्रैप Carousel में AJAX के माध्यम से लोड हो रहा है सामग्री के लिए खोज की साझा करती हैं

समाधान निकला एक छोटे होने के लिए मुश्किल है क्योंकि कैरोसेल की वर्तमान स्लाइड को आसानी से निर्धारित करने का कोई तरीका नहीं है। कुछ डेटा विशेषताओं के साथ मैं (के रूप में आप का सुझाव दिया) .slid घटना को संभालने और फिर jQuery $.load() का उपयोग कर अन्य यूआरएल से सामग्री लोड करने में सक्षम था ..

$('#myCarousel').carousel({ 
    interval:false // remove interval for manual sliding 
}); 

// when the carousel slides, load the ajax content 
$('#myCarousel').on('slid', function (e) { 

    // get index of currently active item 
    var idx = $('#myCarousel .item.active').index(); 
    var url = $('.item.active').data('url'); 

    // ajax load from data-url 
    $('.item').html("wait..."); 
    $('.item').load(url,function(result){ 
     $('#myCarousel').carousel(idx); 
    }); 

}); 

// load first slide 
$('[data-slide-number=0]').load($('[data-slide-number=0]').data('url'),function(result){  
    $('#myCarousel').carousel(0); 
}); 

Demo on Bootply