Discussion :

[haamome]

Bonjour,

J'ai l’impression qu'il y a un truc que je n'arrive pas à saisir.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
 
function setPage(){
	pagination  = '<div id="paginator">';
	for(var j=1;j<=totalPage;j++){
		pgFirst=(j==1)?"pgSelected":"";
		pagination += '<button class="'+pgFirst+'" onclick="displayProducts((('+ j * nbrElemPerPage +') - '+ nbrElemPerPage +'),'+ nbrElemPerPage +','+ filterEnable +')">'+j+'</button>';
	}
	pagination += "</div>";
 
	$('#paginaProd').html("")
	$('#paginaProd').html(pagination);
}

et un peu plus loin

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
 
$(document).ready(function() {
	$('#paginator').on("click", "button", function(e){
		if(oldeV!="")$(oldeV).removeClass('pgSelected');
		$(e.target).addClass('pgSelected');
		oldeV = e.target;
		$('html, body').animate({ scrollTop: 0 }, 'fast');
	});
});

Lors du chargement de la page l’évent fonctionne comme il faut. Mais dès que j’exécute la fonction setPage(), l'affichage de mes produits et du nombre de page et correctement modifié mais l’évent click ne fonctionne plus. J'ai recherché sur internet et ils disent qu'au lieu d'utiliser .click() il faudrait utiliser .on(), qui est une délégation du parent de(s) élément(s) concerné donc peu importe ce que je change dans mon html, les nouveau selectors seront correctement ajouté. Ce que j'ai visiblement fait ci dessus et encore une fois au chargement de ma page tout fonctionne nickel, mais après avoir changé mes boutons de page... rebelote, mon event click ne fonctionne plus.

Si quelqu'un a une idée sur l'erreur que j'ai pu faire ou ou qu'il m'explique pourquoi cela ne marche pas comme il faudrait, ça serait vraiment sympa.

Cordialement.

[Invité]

Bonjour,

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
function setPage(){
	pagination  = '<div id="paginator">';
...

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
	$('#paginator').on("click", "button", function(e){
...

A partir du moment où tu recrées l'id "#paginator", il "disparait" du DOM, et un NOUVEL élément "#paginator" apparait, mais sans les évènements associés au 1er.
En clair, $('#paginator') ne sais plus à quoi se référer...

Il faut donc "accrocher" l'évèenement à un élement "fixe" du DOM (comme "body" *), et déléguer :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
	$("body").on("click", "#paginator button", function(e){
...

* Le mieux étant l'élément "parent" fixe le plus proche.

[haamome]

Je savais bien que c'était un tout petit truc qui me bousillais ma journée. Ça tombe tellement sous le sens après que quelqu'un te le fait remarquer.

Merci pour ton aide jreaux62.

Cordialement.