ui Dialog fonctionne une fois dans IE

Question

J'espère que quelqu'un peut aider avec ce problème. J'utilise ui Dialog qui apparaît en cliquant sur un lien avec la même classe. Le problème est que le lien fonctionne bien une fois mais si je clique dessus encore ou un autre lien avec la même classe alors seulement la surcharge charge mais pas la boîte de contenu dans IE seulement. Cela fonctionne très bien dans Firefox. Mon script inclut un post ajax, si je supprime le code ajax alors la boîte fonctionne bien à chaque clic.

Mon code:

$().ready(function() { 

      $('#dialog').dialog({ 
          autoOpen:false, 
          title: $(this).attr("title"), 
          modal: true, width: 450, height:"auto", resizable: false, 
          close: function(ev, ui) { $(this).remove(); }, 
          overlay: { 
          opacity: 0.5, 
          background: "black" 
          } 
          }); 

    $(".mybutton").click(function(){ 

     $.post($(this).attr("href"), { }, 
      function(data) { 
       $('#dialog').html(data); 

      } 

     ); 
      $('#dialog').dialog('open'); 
      return false; 
     }); 

}); 

J'ai plusieurs liens avec la classe "mybutton" et un div avec l'id #dialog. J'utilise aussi la dernière version de jQuery et ui. Toute aide serait grandement appréciée. Merci

J'utilise IE8, jQuery 1.3.2, jQuery UI 1.7.1

Answer 1

Le poste est fait de manière asynchrone par défaut. On dirait que vous vous attendez à ce qu'il soit synchrone. Essayez de déplacer l'ouverture de la boîte de dialogue dans le rappel après que les données sont définies plutôt que dans la fonction de clic - qui peut s'exécuter avant le retour du rappel.

Answer 2

déplacer l'ouverture dans la fonction de rappel ...

$('#dialog').html(data).dialog('open'); 

Answer 3

je le même problème. Je l'ai résolu en gérant moi-même l'état du Dialogue ... en en créant un nouveau et en le disposant à chaque fois.

function makeDialog() 
{ 
    var html = ''; 
    html += '<div>My dialog Html...</div>'; 

    return $(html).dialog(
    { 
      position: 'center', 
      modal: true, 
      width: 518, 
      height: 630, 
      autoOpen: false, 
      close: function() { $j(this.remove(); } 
    }); 
}