probleme sur script apres changement dom

Question

Bonjour,

j'ai un tableau tout simple en html, avec lequel j'ajoute une ligne grâce a un bouton ajouter.
voici mon code html pour le tableau :

<tr>
<td> <input type="number" id="achat_1" /> </td></tr>

voici mon script qui ajoute une ligne :

var i=$('table tr').length;
$(".addmore").on('click',function(){
	html = '<tr>';
	html += '<td><input type="number" id="achat_'+i+'"/></td>';
        html += '</tr>';
	$('table').append(html);
	i++;

});

tout ca fonctionne, mais j'ai une fonction qui agit sur l'événement blur des id qui commencent par "achat_" cette fonction fonctionne bien pour la 1ere ligne (qui est visible dès le chargement de la page) mais ne marche pas pour les lignes que j'ajoute.

voici ma fonction :

 $(function() {
 
    $('input[id^="achat_"]').blur(function() {
     alert('test');
    });

});

je pense qu'il faut recharger cette fonction lorsqu'on ajoute une ligne, mais j'ai essayer pas mal de chose et je n'y arrive pas.

J'espère que j'ai été assez clair. Merci par avance de votre aide.

Afficher la suite

jordane45 · Answer

Bonjour,

Dans le chargement de ta page :

 $(function() {
     init();
});

function init(){
  $('input[id^="achat_"]').blur(function() {
      alert('test');
  });
}

Dans ta faction d'ajout de ligne

var i=$('table tr').length;
$(".addmore").on('click',function(){
	html = '<tr>';
	html += '<td><input type="number" id="achat_'+i+'"/></td>';
        html += '</tr>';
	$('table').append(html);
	i++;

 init();

});

Pitet · Answer

Salut,

Une autre solution possible est d'utiliser la fonction on :

$(function() {
 
    $('table').on('blur', 'input[id^="achat_"]', function() {
     alert('test');
    });

});


https://api.jquery.com/on/

Bonne journée,

Probleme sur script apres changement dom

2 réponses

Votre réponse

Discussions similaires