2010-12-08 9 views
1

このjQuery UIのタブのモデルは2つのタブしかありません.Ajaxを介して読み込むコンテンツが必要です。問題は、これらのタブがjQuery UIダイアログ内に読み込まれ、midが動的であることです。つまり、ダイアログ(mid=Xを含む)をクリックすると、ダイアログが表示されます。jQuery UIをロードする必要があります。タブAjaxによる動的コンテンツのリンク

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> 

私が最初にこれらの.item-movie-link年代のいずれかをクリックすると、これは動作しますが、ダイアログを閉じて別のリンクをクリックすると、それは機能しません。同じ情報が表示されます。

どうすればこの作品を作成できますか?たぶん、これにはより良いアプローチがありますか?

答えて

1

私の問題は、jQueryのUIダイアログのcloseイベントでのjQuery UIのタブを破壊することによって修正されました:

$('#tabs-movie').tabs('destroy'); 
関連する問題