C# ajaxToolkit:TabContainer添加选项卡时确认_C#_Javascript_Asp.net_Ajax_Tabcontainer

C# ajaxToolkit:TabContainer添加选项卡时确认

c# javascript asp.net ajax

C# ajaxToolkit:TabContainer添加选项卡时确认,c#,javascript,asp.net,ajax,tabcontainer,C#,Javascript,Asp.net,Ajax,Tabcontainer,我希望我的ajaxToolkit:TabContainer有一个tabpanel，允许用户添加另一个选项卡。我只想在他们单击“+”选项卡面板而不是其他面板时将其发回。我似乎无法阻止Javascript中的事件冒泡： <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <script type="text/javascript"> function checkTab(sen

我希望我的ajaxToolkit:TabContainer有一个tabpanel，允许用户添加另一个选项卡。我只想在他们单击“+”选项卡面板而不是其他面板时将其发回。我似乎无法阻止Javascript中的事件冒泡：

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<script type="text/javascript">
    function checkTab(sender, e) {
        if (sender.get_activeTab().get_headerText().replace("<span>", "").replace("</span>", "") != "+") {
            cancelBubble(e);

        }
        else {
            if (!confirm('Are you sure?')) {
                cancelBubble(e);
            }
        }
    }
    function cancelBubble(e) {
        if (e) {
            e.stopPropagation();
        }
        else {
            window.event.cancelBubble = true;
        }
    }
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
    <asp:ScriptManager ID="ScriptManager" runat="server">
</asp:ScriptManager>
  <ajaxToolkit:TabContainer ID="MyTabContainer" runat="server" OnActiveTabChanged="MyTabContainer_OnActiveTabChanged"
        AutoPostBack="true" OnClientActiveTabChanged="checkTab">
        <ajaxToolkit:TabPanel ID="TabPanel1" runat="server" HeaderText="My First Tab" Enabled="true">
            <ContentTemplate>
                My first tab
            </ContentTemplate>
        </ajaxToolkit:TabPanel>
        <ajaxToolkit:TabPanel ID="AddTabPanel" runat="server" HeaderText="+" Enabled="true">
            <ContentTemplate>
            </ContentTemplate>
        </ajaxToolkit:TabPanel>
    </ajaxToolkit:TabContainer>
</div>
</form>
</body>
</html>


 protected void MyTabContainer_OnActiveTabChanged(object sender, EventArgs e)
    {
        TabPanel tp = new TabPanel();
        tp.HeaderText = "New Tab";
        MyTabContainer.Tabs.Add(tp);
    }


功能检查选项卡（发件人，e）{
if（sender.get\u activeTab（）.get\u headerText（）.replace（“，”）.replace（“，”）！=“+”）{
取消气泡（e）；
}
否则{
如果（！confirm（'你确定吗？'））{
取消气泡（e）；
}
}
}
函数（e）{
如果（e）{
e、 停止传播（）；
}
否则{
window.event.cancelBubble=true；
}
}
我的第一张账单
受保护的无效MyTabContainer\u OnActiveTabChanged（对象发送方，事件参数e）
{
TabPanel tp=新的TabPanel（）；
tp.HeaderText=“新建选项卡”；
MyTabContainer.Tabs.Add（tp）；
}

谢谢，

Alex

您可以使用

返回false停止回发。所以我认为你所需要的就是：
function checkTab(sender, e) 
{
    if (sender.get_activeTab().get_headerText().replace("<span>", "").replace("</span>", "") != "+") 
    {
        return false;
    }
    else 
    {
       return confirm('Are you sure?');
    }
}

功能检查选项卡（发送方，e）
{
if（sender.get\u activeTab（）.get\u headerText（）.replace（“，”）.replace（“，”）！=“+”）
{
返回false；
}
其他的
{
返回确认（“您确定吗？”）；
}
}
将下面的脚本添加到项目中，并在页面底部添加参考：
Sys.Extended.UI.TabPanel.prototype.raiseClick = function (eventArgs) {
    var eh = this.get_events().getHandler("click");
    if (eh) {
        eh(this, eventArgs);
    }
};

Sys.Extended.UI.TabPanel.prototype._header_onclick = function (e) {
    e.preventDefault();
    var eventArgs = new Sys.CancelEventArgs();
    this.raiseClick(eventArgs);

    if (eventArgs.get_cancel() === true)
        return;

    this.get_owner().set_activeTab(this);
    this._setFocus(this);
};

现在，我们添加了取消单击客户端上特定选项卡的功能。用法示例：
 <script type="text/javascript">
      function AddTabOnClientClick(sender, args) {
           args.set_cancel(!confirm("Are you sure?"));
      }
 </script>

 <form id="form1" runat="server">
 <ajaxToolkit:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server">
 </ajaxToolkit:ToolkitScriptManager>
 <div>
      <asp:UpdatePanel runat="server">
           <ContentTemplate>
                <ajaxToolkit:TabContainer ID="MyTabContainer" runat="server" AutoPostBack="true"
                     ActiveTabIndex="0">
                     <ajaxToolkit:TabPanel ID="TabPanel1" runat="server" HeaderText="My First Tab" Enabled="true">
                          <ContentTemplate>
                               My first tab
                          </ContentTemplate>
                     </ajaxToolkit:TabPanel>
                     <ajaxToolkit:TabPanel ID="AddTabPanel" runat="server" HeaderText="+" OnClientClick="AddTabOnClientClick">
                          <ContentTemplate>
                          </ContentTemplate>
                     </ajaxToolkit:TabPanel>
                </ajaxToolkit:TabContainer>
           </ContentTemplate>
      </asp:UpdatePanel>
 </div>
 </form>
 <script src="Scripts/MyAjaxToolkitExtensions.js" type="text/javascript"></script>


函数AddTabOnClientClick（发送方，参数）{
args.set_cancel（！confirm（“您确定吗？”））；
}
我的第一张账单
多亏了jadarnel27，这是我最终选择的解决方案：
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<script type="text/javascript">
<script type="text/javascript">
    function addTab() {

        if (confirm('Are you sure?')) {
            document.getElementById('<%=AddTabButton.ClientID %>').click();
        }
    }
</script>
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:ScriptManager ID="ScriptManager" runat="server">
</asp:ScriptManager>
 <asp:Button ID = "AddTabButton" runat="server" OnClick="AddTabButton_OnClick" CssClass="DisplayNone" />
  <ajaxToolkit:TabContainer ID="MyTabContainer" runat="server">
    <ajaxToolkit:TabPanel ID="TabPanel1" runat="server" HeaderText="My First Tab" Enabled="true">
        <ContentTemplate>
            My first tab
        </ContentTemplate>
    </ajaxToolkit:TabPanel>
    <ajaxToolkit:TabPanel ID="AddTabPanel" runat="server" HeaderText="+" Enabled="true" OnClientClick="addTab">
        <ContentTemplate>
        </ContentTemplate>
    </ajaxToolkit:TabPanel>
</ajaxToolkit:TabContainer>
</div>
</form>
</body>
</html>


protected void AddTabButton_OnClick(object sender, EventArgs e)
    {
       TabPanel tp = new TabPanel();
    tp.HeaderText = "New Tab";
    MyTabContainer.Tabs.Add(tp);
    }


函数addTab（）{
如果（确认（'你确定吗？'））{
document.getElementById（“”）。单击（）；
}
}
我的第一张账单
受保护的void AddTabButton_OnClick（对象发送方，事件参数e）
{
TabPanel tp=新的TabPanel（）；
tp.HeaderText=“新建选项卡”；
MyTabContainer.Tabs.Add（tp）；
}
不好，它仍然会通过回发，因为它不允许我这样做：onclientactivetabchange=“return checkTab”@AlexDriver我已经有一段时间没有使用AJAX控件工具包控件了，但是您是否尝试过onclientactivetabchange=“return checkTab（this）；”
或者只是onclientactivetabchange=“return checkTab（）；”
？SyntaxError:语法错误…pPlacement:false}，{“activeTabChanged”：返回checkTab（this）；}，null@AlexDriver我觉得奇怪的是，OnClientActiveTabChanged=“checkTab“
无法使用上述代码。很抱歉，我真的认为这会起作用。@AlexDriver您是否尝试过将事件附加到实际“+”选项卡ASN的OnClientClick
事件，并以这种方式进行处理（意识到您必须稍微调整逻辑）？