événement de changement ne

Question

je déclenche pas sur les formulaires ajax chargés d'un document HTML, avec le code jquery

$(function(){ 
[...] 
    $("#newNotice").click(function(){ 
     $("#properties").load("testDiagramm.html #NoticeForm"); 
     return false; 
     }); 
    function showFormValues(){ 
     var s = $("form").serialize(); 
     [... Do things ...] 
    } 
    $("input, textarea").change(showFormValues); 
    }); 

Au début, il n'y a pas de forme dans le document HTML. Mais je charge différents formulaires dans le document. Une de ces demandes que vous pouvez voir ici

$("#properties").load("testDiagramm.html #NoticeForm"); 

Le problème est. que la ligne de codage

$("input, textarea").change(showFormValues); 

seulement feu, lorsque la forme a été chargée au début. Que dois-je faire, si je veux exécuter la fonction showFormValues ​​(), quand j'ai changé quelque chose dans le formulaire, que je charge plus tard?

Merci beaucoup pour vos réponses.

Lara

Answer 1

Votre formulaire perd sa liaison au DOM après avoir été rechargée via ajax, donc des gestionnaires d'événements précédemment lié aux éléments qui s'injectés dans la page sont perdues.

Je normalement suggère d'utiliser la délégation de l'événement avec live, mais il ne prend pas en charge l'événement de changement, donc un pari sûr serait de lier de nouveau au moyen d'un rappel comme second paramètre à votre fonction .load de $:

$(function(){ 
[...] 
    $("#newNotice").click(function(){ 
     $("#properties").load("testDiagramm.html #NoticeForm", function() { 
      $("input, textarea").change(showFormValues); 
     }); 
     return false; 
     }); 
    function showFormValues(){ 
     var s = $("form").serialize(); 
     [... Do things ...] 
    } 
    $("input, textarea").change(showFormValues); 
    });