jQuery Formulaire de boîte de dialogue sérialiser la copie de données incorrectes sur les utilisations suivantes

Question

Je travaille avec des formulaires dans jQuery Dialog et j'ai des problèmes avec les données qu'il affiche. Premier chargement et enregistrer fonctionne correctement, publie les données correctes. Jusqu'à ce que je rafraichisse la page, chaque charge suivante semble fonctionner, comme dans les données correctes sont sous la forme, cependant, lors de l'enregistrement, les données du premier chargement sont ce qui est posté à chaque fois.

function formdialog(url, tack, divid, scriptload){ 
    $.getJSON(url+tack+"/form", function(data){ 
     var formwin = '<div><form id="formdialog">'+data['form']+'</form></div>'; 
     var dialog = $(formwin).dialog({ 
      title: data['title'], 
      autoOpen: false, 
      modal: true, 
      buttons: { 
       "Save": function(){  
        $.post(url+tack+"/process", 
         $("#formdialog").serialize(), 
         function(data){ 
          alert($("#formdialog").serialize()); 
          $(this).dialog('close'); 
          $(this).remove(); 
         } 
        ); 
       }, 
       "Cancel": function(){$(this).dialog('close'); $(this).remove();} 
      } 
     }); 

     dialog.dialog("open"); 
    }); 
} 

$(function(){   
    $("a.edlnk").click(function(){ 
     var url = $(this).attr("href"); 
     formdialog(CONFIG_HREF_SITE+"ajax/"+appControl, "/"+url, divid); 
     return false; 
    }); 
}); 

Answer 1

Je crois que le problème est le

$(this).dialog('close'); 
$(this).remove(); 

... dans votre rappel post, parce que vous n'avez pas spécifié le contexte de la fonction de rappel. Dans ce cas, la modification du post à ce qui devrait fixer:

$.ajax({ 
    url:  url+tack+"/process", 
    type:  'POST', 
    data:  $("#formdialog").serialize(), 
    context: this, 
    success: function(data){ 
     alert($("#formdialog").serialize()); 
     $(this).dialog('close'); 
     $(this).remove(); 
    } 
}); 

... parce que vous êtes en préservant le sens de this lorsque la fonction est appelée success.

Alors pourquoi ce problème causerait le comportement que vous voyez? Parce que si vous ne supprimez pas le formwindiv, vous ne supprimez pas le formdialogform, ce qui signifie que vous obtenez plusieurs form s sur la page avec le même ID. Bien qu'ayant le même ID sur plusieurs éléments est invalide et donc sujet à un comportement indéfini, la plupart des navigateurs vous donneront l'élément correspondant premier lorsque vous demandez un élément par ID   — qui dans votre cas serait le format antérieur avec les données antérieures.

---

Modifier Re votre commentaire: Oui, je sorte de raté la $(this).dialog('close') là-bas. :-) deux options: l'une est de se rappeler $(formwin) dans une variable locale, puis l'utiliser dans le rappel, par exemple:

var formwin = '<div><form id="formdialog">'+data['form']+'</form></div>'; 
var formwinElement = $(formwin);  // <== Remember it here 
var dialog = formwinElement.dialog({ // <== Use it here 

// ... 

       $.post(url+tack+"/process", 
        $("#formdialog").serialize(), 
        function(data){ 
         alert($("#formdialog").serialize()); 
         $(this).dialog('close'); 
         formWinElement.remove(); // <== And again here 
        } 
       ); 

... et ne vous embêtez pas avec le context param (d'où mon utilisation de votre $.post original dans cette mise à jour). Cela fonctionne parce que le gestionnaire de succès post est une fermeture sur la variable formwinElement (et plusieurs autres choses).