Besoin de charger jQuery UI Tabs liens de contenu dynamique via Ajax

Question

J'ai ce modèle jQuery UI Tabs avec seulement 2 onglets et j'ai besoin du contenu à charger via Ajax. Le problème est que ces onglets sont chargés dans une boîte de dialogue jQuery UI et mid est dynamique. Je veux dire, le dialogue est lancé en cliquant sur un lien (qui contient mid=X).

Le code est quelque chose comme ceci:

Javascript:

$('.item-movie-link').each(function() { 
    $(this).parent().click(function() { 
     $('#tabs-movie li a[href$=info]').attr('href', $(this).attr('href') + '&op=info'); 
     $('#tabs-movie li a[href$=cast]').attr('href', $(this).attr('href') + '&op=cast'); 

     $('#dialog-movie-info').dialog('open'); 
     $('#tabs-movie').tabs(); 

     return false; 
    }); 
}); 

HTML:

<div id="dialog-movie-info"> 
    <div id="tabs-movie"> 
    <ul> 
     <li><a href="#tab-info"><img src="template/images/icon-tab-movie-info.png" alt="" />Information</a></li> 
     <li><a href="#tab-cast"><img src="template/images/icon-tab-movie-cast.png" alt="" />Cast List</a></li> 
    </ul> 
    </div> 
</div> 

Cela fonctionne quand je clique sur un de ces .item-movie-link « s, mais après la fermeture du dialogue et en cliquant sur un autre lien, cela ne fonctionnera pas, le la même information sera affichée.

Comment est-ce que je peux faire ce travail? Peut-être qu'il y a une meilleure approche pour cela?

Answer 1

Mon problème a été résolu en détruisant les onglets jQuery UI sur l'événement close de l'interface utilisateur jQuery Dialog:

$('#tabs-movie').tabs('destroy');