Jquery / Pagination et script non exécuté en page 2
Fermé
dd50000
-
7 juin 2013 à 13:33
Bonjour,
Voici mon petit soucis concernant ma pagination et l'exécution de mes scripts.
Ma pagination fonctionne parfaitement et m'affiche exactement le résultat souhaité. Ma liste entière est découpée en plusieurs morceaux puis vient le premier affichage grâce à ce code.
<script type="text/javascript">
function pageselectCallback(page_index, jq){
// Get number of elements per pagionation page from form
var items_per_page = $('#items_per_page').val();
var max_elem = Math.min((page_index+1) * items_per_page, members.length);
var newcontent = '';
// Iterate through a selection of the content and build an HTML string
for(var i=page_index*items_per_page;i<max_elem;i++)
{
newcontent += ' <span class="header tk tk3 title-section"><strong>150 biens proposés</strong></span><div class="mod-room-result cf room-disability-accessible room-standard-accessible">';
newcontent += '<span href="expanded_view.php" class="expand-button collapsed">Toggle</span>';
newcontent += '<div class="collapsed">';
newcontent += '<form method="get" action="details.php"><div class="col-a">';
newcontent += '<a href="expanded_view.php" class="room-image">';
newcontent += '<img class="" src="1.jpg" alt="" width="232"/>';
newcontent += '</a>';
newcontent += '</div>';
newcontent += '<div class="col-b">';
newcontent += '<span class="header tk tk1"><strong>Titre</strong></span>';
newcontent += '<p>'+members[i][10]+'</p>';
newcontent += '<a href="expanded_view.php" class="tk2 more-button">Voir plus d\'informations et de photos</a>';
newcontent += '</div>';
newcontent += '<div class="col-c">';
newcontent += '<span class="header tk tk1">Référence annonce</span><ul><li class="cost tk tk3">Numero</li></ul></div>';
newcontent += '<div class="col-d"><span class="header tk tk1">Prix</span>';
newcontent += '<ul><li class="cost tk tk3"><strong>Prix €</strong></li><li><a href="details.php"><img src="btn-detail.jpg" alt=""></a></li></ul></div></form>';
newcontent += '</div>';
newcontent += '</div>';
}
// Replace old content with new content
$('#Searchresult').html(newcontent);
// Prevent click eventpropagation
return false;
}
// The form contains fields for many pagiantion optiosn so you can
// quickly see the resuluts of the different options.
// This function creates an option object for the pagination function.
// This will be be unnecessary in your application where you just set
// the options once.
function getOptionsFromForm(){
var opt = {callback: pageselectCallback};
// Collect options from the text fields - the fields are named like their option counterparts
$("input:hidden").each(function(){
opt[this.name] = this.className.match(/numeric/) ? parseInt(this.value) : this.value;
});
// Avoid html injections in this demo
var htmlspecialchars ={ "&":"&", "<":"<", ">":">", '"':"""}
$.each(htmlspecialchars, function(k,v){
opt.prev_text = opt.prev_text.replace(k,v);
opt.next_text = opt.next_text.replace(k,v);
})
return opt;
}
// When document has loaded, initialize pagination and form
$(document).ready(function(){
var optInit = getOptionsFromForm();
$("#Pagination").pagination(members.length, optInit);
// Event Handler for for button
$("#setoptions").click(function(){
var opt = getOptionsFromForm();
// Re-create pagination content with new parameters
$("#Pagination").pagination(members.length, opt);
});
});
</script>
Le résultat est affiché dans la div Searchresult. Grace au petit bouton Toggle, je peux afficher le detail de mon annonce grace à Jquery.
Tout ceci fonctionne mais en page 2, l'affichage se fait correctement mais le Toggle ne s'execute plus. Il n'y a plus d'événement sur click.
Pouvez vous m'aider sur ce sujet là car ne connaissant qu'un minimum de chose à propos de Jqery, la tâche n'est pas aisée.
J'apprécierai tous vos conseils, merci d'avance.
A votre disposition pour tester. ( Je suis au cul de l'ordi j'en peux plus !! )
A voir également:
Jquery / Pagination et script non exécuté en page 2