Discussion :

[Thierry TC]

Bonjour à tous,
J'aimerais écrire plus proprement le code jquery plus bas,
le principe,
un fichier tpl affiche une liste de bannières avec leurs liens.
un fichier jquery qui appelle avec ajax le fichier php "suivi-lien.php" qui lui enregistre dans la bdd le clic ainsi que d'autres infos.

Le problème est que l'id de la balise <a> et à chaque fois différent, d'où cette répétition dans le code jquery,
l'idée serait de pouvoir récupérer l'id de la balise <a> dans jquery pour ne le traiter qu'une seule fois, mais je ne sais pas faire ça...

D'avance merci

fichier tpl

Code html :

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

1
2
3
4
5
{foreach $selpub as $pub}
<div class="affichepub">
	<a id="ban{$pub.id}" class="suivi" target="_blank" title="{$pub.title}" href="{$pub.url}"><img alt="" src="img/pub/{$pub.img}"/></a>
</div>
{/foreach}

jquery

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
	$(document).on('click','#ban1',function(){
		$.ajax({
			type : 'GET',
			url : 'suivi-lien.php?ban=1'
		});
	});
 
	$(document).on('click','#ban2',function(){
		$.ajax({
			type : 'GET',
			url : 'suivi-lien.php?ban=2'
		});
	});	
 
	$(document).on('click','#ban3',function(){
		$.ajax({
			type : 'GET',
			url : 'suivi-lien.php?ban=3'
		});
	});
 
       // etc... une vingtaine de bannières

[Doksuri]

salut, tu as deja un probleme de conprehention : tu ne dois pas definir X events click car ils vont se cumuler..
quand tu definis X evenements click sur le document : a chaque fois qu'il y aura un click, TOUS vont s'executer
=> si j'ai bien compris, tu ne veux faire un ajax QUE sur la banniere cliquee

=> tu dois cibler chaque banniere, mais avant, je te conseilles de passer par les dataset des elements plutot que par un ID (car d'apres ton exemple, ton ID que tu cherches n'est pas "banX" mais juste "X". pour ca, utilises data-*

Code :

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

1
2
3
4
5
{foreach $selpub as $pub}
<div class="affichepub">
	<a data-id="{$pub.id}" class="suivi" target="_blank" title="{$pub.title}" href="{$pub.url}"><img alt="" src="img/pub/{$pub.img}"/></a>
</div>
{/foreach}

apres, tu cibles chaque lien pour faire un traitement dessus (pas besoin de jquery : du JS "natif" le fait tout aussi bien )

Code javascript :

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

1
2
3
4
5
document.querySelectorAll('.affichepub a').forEach(link => {
    link.addEventListener('click', function() {
        fetch(`suivi-lien.php?ban=${this.dataset.id}`);
    });
});

[Thierry TC]

Merci Docksuri, j'ai pas mal ramé, le js c'est pas vraiment mon truc...
finalement j'ai fait ça et ça marche nickel

Code :

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

1
2
3
4
5
6
7
8
 
	$(document).on('click','.affichepub a',function(){	
		var dataId = $(this).attr("data-id");
		$.ajax({
			type : 'GET',
			url : 'suivi-lien.html?ban='+ dataId
		});
	});