0

1 つのタブに項目のリストが表示されており、項目の 1 つをクリックして新しいタブを開き、その詳細を新しいタブに表示できるようにしたいと考えています。次のようにして、新しいタブを追加しています。

$(".btn-opener").click(function(){

$('#tabs').tabs('add', 'http://localhost/GetItem/' + $(this).attr('href'), "View Details");

}

私の問題は、URL が実際には JSON を返すサービス エンドポイントであることです。返されたデータに js テンプレートを適用できるようにしたいと考えています。どうすればいいですか?タブのロード イベントにフックする必要がありますか?

4

1 に答える 1

0

これを解決するには、必要な HTML を含む div をタブ コンテナに追加し、その ID を使用して新しいタブのフラグメントを設定します。例えば:

$('.btn-opener').click(function () {

    var $this = $(this),
        itemID = $this.data("item-id");

            $.get("http://localhost/GetItem/" + itemID,

                function (data, textStatus, jqXHR) {

                    var html = Mustache.to_html($("#item-template").html(), data);                          

                    $("#tabs").append('<div id="' + id + '">' + html + '</div>');
                    $('#tabs').tabs("add", "#" + id, $this.text());

                },  
                "json"
            );

            return false;
        });

これを答えとしてマークする前に、誰かがより良い解決策を思い付くかどうかを確認するのを待ちます.

于 2012-04-25T21:20:54.933 に答える