在Tabpanel中使用引导模式来设置活动标签

Question

我正在使用下面的jquery来控制在AjaxControlToolkit tabcontainer中单击选项卡时会发生什么。

如果隐藏文本输入（hdnFormSaved）的值为“ True”，则将单击的选项卡设置为活动的（ this.get_owner().set_activeTab(this) ），否则将创建确认对话框。 如果通过对话框确认，则仅将单击的选项卡设置为活动。

$(function () {
    Sys.Extended.UI.TabPanel.prototype._header_onclick =
        function (e) {
            this.raiseClick();
                if ($("[id$=hdnFormSaved]").val() == "True") {
                    this.get_owner().set_activeTab(this);
                } else {
                    if (confirm('Do you want to change tab?'))
                        this.get_owner().set_activeTab(this);
                    else
                        return false;
                }
        };
});

该解决方案完美地工作。 但是，我想用引导程序模式替换确认对话框。

<div class="modal" id="myModal" tabindex="-1" role="dialog">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
               <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
               <h4 class="modal-title">Warning</h4>
            </div>
            <div class="modal-body">
                <p>Do you want to change tab?</p>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                <button type="button" class="btn btn-primary">OK</button>
            </div>
        </div><!-- /.modal-content -->
    </div><!-- /.modal-dialog -->
</div><!-- /.modal -->

我已经尽力在else块中而不是在确认对话框中初始化模式。 从这里，我不确定如果单击模式的“确定”按钮，如何继续将单击的选项卡设置为活动状态。 我可以/应该在同一个else块中监听事件吗？

$(function () {
    Sys.Extended.UI.TabPanel.prototype._header_onclick =
        function (e) {
            this.raiseClick();
                if ($("[id$=hdnFormSaved]").val() == "True") {
                    this.get_owner().set_activeTab(this);
                } else {
                    $('#myModal').modal();
                }
        };
});

欢迎任何建议。 谢谢。

Answer 1

解决方法如下：

$(function () {
    Sys.Extended.UI.TabPanel.prototype._header_onclick =
        function (e) {
            this.raiseClick();
                if ($("[id$=hdnFormSaved]").val() == "True") {
                    this.get_owner().set_activeTab(this);
                } else {
                    obj = this;
                    $('#myModal').modal();
                        $("#btn_okay").on("click", $.proxy(function () {
                            this.get_owner().set_activeTab(this);
                        }, this));
        }
    };
});

我给模式OK按钮指定了#btn_okay的ID，并使用了jquery的proxy将上下文传递给on匿名函数。