2012-04-25 315 views
0

我有一个选项卡中显示的项目列表,我希望能够点击其中一个项目并打开一个新选项卡并在新选项卡上显示其详细信息。我通过执行以下操作将新标签:jquery-ui选项卡 - 添加选项卡

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

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

} 

我的问题是,URL实际上是一个服务端点返回JSON。我希望能够将js模板应用于返回的数据。我该怎么做呢?我需要钩入标签的加载事件吗?

回答

0

我想我要通过添加一个带有我需要的HTML到div的conainer的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; 
     }); 

我会等待看看有没有人提出更好的解决方案,然后再将其标记为答案。