重新触发引导选项卡更改事件

Question

我的屏幕看起来如下：

通过选项卡更改事件上的ajax调用来加载选项卡。页面顶部的网格需要能够触发特定选项卡的show事件（因为它提供了id等等），但它仅适用于单击的第一个项目，几乎就像第二次单击被阻止一样

简化代码

$(function() {

    var self = this;

    self.agencyId = -1;

    self.SwitchView = function(partialViewName, targetDiv) {
        alert('Switching To ' + partialViewName)
    };

    $("#AgencyTabs").tab();
    $("#AgencyTabs").on("show", function(e) {

        var target = "#partialContainer";
        var partialViewName = $(e.target).data("src");

        self.SwitchView(partialViewName, target);

        $("#AgencyTabs").tab();
    });



    $('#toolbar').on('click', '.action-button', function() {

        var iGrid = this;

        self.agencyId = $(iGrid).data('rowid');
        self.currTab = "Details";

        $('#AgencyTabs a[data-src="' + self.currTab + '"]').tab('show');

        return false;
    });


    $('#AgencyTabs a[data-src="Parameters"]').tab('show');

});​

我已设置此fiddle来演示我的问题

Answer 1

Is this what you need?

$("#AgencyTabs").on("show", function(e) {
    var target = "#partialContainer";
    var partialViewName = $(e.target).data("src");

    //self.SwitchView(partialViewName, target);

    $("#AgencyTabs").tab();
});

$("#AgencyTabs").on("click", function(e) {
    self.SwitchView($(e.target).data("src"), e.target);
});

根据我的理解，问题是当选项卡已被选中时SwitchView没有被执行。此编辑通过将函数执行从onshow事件移动到onclick事件来修复该问题。

修改

The fiddle现在在＆＃34; View＆＃34;上执行SwitchView按钮，也。但是，它并没有专门触发onshow事件，只是调用函数。

修改为$（＆＃39;＃toolbar＆＃39;）。on（＆＃39;点击＆＃39;，＆lt; ...＆gt;）; ：

$('#toolbar').on('click', '.action-button', function() {

    var iGrid = this;

    self.agencyId = $(iGrid).data('rowid');
    self.currTab = "Details";
    self.targeted = $('#AgencyTabs a[data-src="' + self.currTab + '"]')

    self.SwitchView(self.currTab, self.targeted);

    self.targeted.tab('show');

    return false;
});