1

私は、ユーザーがページ領域の個別のタブにそれぞれ表示される一連のビデオをアップロードできるようにするユーザーインターフェイスを作成しています。新しいビデオがアップロードされたとき、または既存のビデオが削除されたとき(両方ともAJAX経由)、それに応じてタブを更新したいと思います。更新後にタブを再描画するのに問題があり、運がありません。これが私がしていることです:

javaScriptは、次のようにサーバーにリクエストを送信します。

function deleteVideo(id){
    $.post("video.php?action=deletevideo",
        {'id' : id},
        function(response){
            $('#videoTabs').html(response);
            $('#videoTabs').tabs();
        }
    );
}    

PHP側では、リクエストは次のように処理されます。

switch($_GET['action']) {
    case 'deletevideo':
        try{
            $video = new videoClass($_POST['id']);
            $video->delete();
            draw_video_tabs();
        }catch(Exception $e){
            echo $e->getMessage();
        }
        break;

PHPスクリプトによって返されるコードは私が期待するものとまったく同じであり、「draw_video_tabs」関数は最初にページを描画するときに使用するものと同じであることがわかります(ajaxを使用していません)。それが私に与えているHTMLは、まさにそれがどうあるべきかです。

ただし、何らかの理由で応答を返送するときに、「#videoTabs」divがタブ化されていません。代わりに、ストレートHTML(箇条書きと一致するdivのセット)が表示されます。

また、応答をJSONエンコードされたオブジェクトとして返送し、その方法で本文に挿入してみました。それも私に正しいコードを与えますが、タブはありません。

だから私はここで何が欠けていますか?コンテンツがAJAXリクエストからロードされるときに、タブを作成する比較的簡単な方法があると思います。ロードしているのはタブセット全体であり、1つのタブではないことに注意してください。これは、ページの読み込み時にすでに生成されていたのと同じdivに読み込まれています。

4

1 に答える 1

1

すべてのタブをロードしたい場合は、古いhtmlマークアップを削除して、新しいものを挿入してみませんか?追加と削除のみの場合は、次の記事を参照してください:jQueryとjQueryUIを使用したタブの追加と削除

追加: すべてのドキュメントはhttp://jqueryui.com/demos/tabs/(タブメソッド)にあります。

.tabs( "destroy" )
.tabs( "add" , url , label , [index] )
.tabs( "remove" , index )
于 2012-09-19T21:56:11.010 に答える