Recuperation d'Id d'une tr apres le chargement par ajax
nada12345
Messages postés
7
Statut
Membre
-
nada12345 Messages postés 7 Statut Membre -
nada12345 Messages postés 7 Statut Membre -
Bonjour,
j’ai un tableau dynamique ou je veux récupérer l'id de la ligne selictionné pour la modifier,
mon problème c'est que je peux pas utiliser l'objet $(this) après le chargement de ma page par ajax
voici mon script ou je veux recupérer id du tr pour la modifier
Merci d'avance
j’ai un tableau dynamique ou je veux récupérer l'id de la ligne selictionné pour la modifier,
mon problème c'est que je peux pas utiliser l'objet $(this) après le chargement de ma page par ajax
<tbody class="table-article-tbody" id="table_article_tbody">
{% for ligne in liste_article %}
<tr id="{{ ligne.ref_article }}">
<td>{{ ligne.descripton_article }}</td>
<td>{{ ligne.compte_article }}</td>
<td>{{ ligne.quantite_article }}</td>
<td>{{ ligne.prix_unitaire }}</td>
<td>{{ ligne.tva_article }}</td>
<td>{{ ligne.montant_article }}</td>
<td><a id="update_ligne" href="#" rel="nofollow noopener noreferrer" target="_blank">modifier</a></td>
</tr>
{% endfor %}
voici mon script ou je veux recupérer id du tr pour la modifier
<script>
$('#table_article tr').on('click', function(event){
event.preventDefault();
if($(this).attr('id') != undefined){
alert($(this).attr('id'));
$.ajax({
type: 'GET',
url : "{% url 'updateligneFacture_tem' %}",
data: $("#form_facture").serialize(),
success : function(data){
$('#contenue').[/contents/498-html-langage html](data);
$(this).html("
<td>{{ formFacture.description_article }}</td>
<td>{{ formFacture.compte_article }}</td>
<td>{{ formFacture.quantite_article }}</td>
<td>{{ formFacture.prix_unitaire_article }}</td>
<td>{{ formFacture.tva_article }}</td>
<td>{{ formFacture.montant }}</td>
");
$('#table_article tr:last').remove();
$('.selectpicker').selectpicker();
},
error : function(){
alert("Erreur update !!");
}
});
}
});
</script>
Merci d'avance
1 réponse
-
Salut,
Essaye de modifier la déclaration de ton listener comme ceci :$('body').on('click', '#table_article tr', function(event){
Explication ici : https://api.jquery.com/on/#direct-and-delegated-events
Bonne journée,-
-
Effectivement j'avais mal compris le problème.
Si tu veux utiliser la $this de ton listener (la première fonction) dans la fonction success de la requête ajax, tu peux simplement enregistrer la variable $this dans une autre variable. Par exemple :<button class="btn">test</button> <script src=""quot;https://code.jquery.com/jquery-3.1.1.min.js"></script> <script> $(function () { $('.btn').click(function () { // creation variable var $this = $(this); console.log($this); $.ajax({ url: '#', success: function (data) { // utilisation variable console.log($this); } }); }); }); </script> -
merci bien Pilet grâce au stockage du variable $this maintenant je peux récupérer l id de mon tr mais ce code ne fonctionne pas si vous avez une aidé pour quoi ça marche pas
$this.html("
<td>{{ formFacture.description_article }}</td>
<td>{{ formFacture.compte_article }}</td>
");
et merci encore une foie -
La syntaxe {{ data }} semble provenir d'un moteur de template (Twig ?) qui est donc à interpréter en PHP et non en Javascript.
La génération du html "<td>{{ formFacture.description_article }}</td>..." devrait être fait dans le script PHP de traitement de la requête ajax afin que celui-ci retourne uniquement le code html avec les données. -
{{ formFacture.description_article }} c'est champ de text prévient d'une view django et je l'ai déja générer dans mon html mais je veux l'afficher encore une fois par le code ajax afin de modifier l tr de mon tableau
mon code html
{% for ligne in liste_article %}
<tr id="{{ ligne.ref_article }}">
<td>{{ ligne.descripton_article }}</td>
<td>{{ ligne.compte_article }}</td>
</tr>
{% endfor %}
<tr>
<td>{{ formFacture.description_article }}</td>
<td>{{ formFacture.compte_article }}</td>
</tr>
-
