11521 sujets

JavaScript, DOM et API Web HTML5

[Résolu] Lien sur onclick ne fonctionne pas

Salut tout le monde, j'ai besoin d'une aide technique sur un pb de onclick, je m'explique en appyant sur onclick dans un menu on charge une div avec un retour json, dans la construction de ce retour je mets en place un autre lien onclick, mais celui-ci ne fonctionne pas je vous mets le code que j'ai écrit , pouvez vous m'aider à éclaircir ce pb

<script type="text/javascript">
$(document).ready(function(){
	$('.lien').click(function(){
		var script = this.id;
		$.ajax({ 
		type : 'POST',
      	url: 'scripts/maintenance.php', 
      	data: 'table=' + script,  
      	dataType: 'json', 
    	})
    	.done(function(data) {
			var tableau =''; 
			for (var i = 0; i<data['libelle'].length; i++) {
				tableau +="<tr><td>"+ data['libelle'][i]+"</td><td><a href='#' class='lien_modif' id='test'><span class='glyphicon glyphicon-zoom-in'></span></a></td><td><span class='glyphicon glyphicon-remove'></span></td><tr>";
			}
			var table ='';
			table = "<h2> Gestion : "+script+"</h2><a href='#' id='ajout' class='ajout'>Ajout</a><div class='responsive-table-line' style='margin:0px auto;max-width:400px;'><table  class='table table-striped table-bordered table-condensed table-body-center'><tbody>";
			$('#espace_travail').html(table+tableau+"</tbody></table>");
		});
		$('#maintenance').setAttribute("aria-expanded","false");
		return false;
	});
	
	$('.lien_modif').click(function(){
		var script = this.id;
		alert(script);
	});
});
</script>

lorsque je clique sur lien de class lien_modif il ne se passe rien

Merci pour votre aide[/i]
Salut microphil et bienvenu sur le forum !

Ton problème est simple et fait référence à l'attache des événements gérée par jQuery avec la méthode .on(). Cette méthode s'utilise particulièrement dans ton cas où il y a un appel AJAX, donc des éléments nouveaux créés APRES le chargement de la page.

Dans ton cas, tu attaches l'événement "click" à l'élément $('.lien_modif') alors que celui-ci n'existe pas encore, donc il ne se passera rien puisqu'au moment où $('.lien_modif') arrive dans le DOM, la déclaration de ton événement "click" est déjà passé depuis un sacré bout de temps...

Pour ça tu peux faire de la fonction suivante en remplaçant ta déclaration par celle-ci :
$('#espace_travail').on('click', '.lien_modif', function(){
		var script = this.id;
		alert(script);
	});

Il faut attacher ton événement à un élément proche qui ne change pas tout au long de tes actions dans une page ('body', '.wrapper'). Dans ton cas j'ai l'impression que $('#espace_travail') ne bouge pas, donc c'est un repère fixe.

2ème solution : appeler ton "$('.lien_modif').click()" à l'intérieur de ton .done() (au passage pas la meilleure manière mais bon c'est un autre sujet...), juste après ta ligne "$('#espace_travail').html(table+tableau+"</tbody></table>");". Tu déplaces ta déclaration.
Modifié par MatthieuR (28 May 2016 - 16:14)
Sujet clos
Aller à