我需要在按钮单击事件之间切换引导选项卡（如果满足单击事件中的某些条件）等等。但是它无法正常工作。我一直在尝试各种方式但没有任何效果。如果我删除了updatepanel在第一个标签中它可以工作，但我不希望整个页面被刷新。任何帮助都会非常感激。谢谢提前。谢谢我的代码。
<div id="Left" class="w3-container city w3-animate-Zoom" style="display: none">
<div class="row">
<div class="col-md-6" style="width:100%;margin-top:50px">
<div class="tab" id="Tabs" role="tabpanel">
<!-- Nav tabs -->
<ul class="nav nav-tabs" id="TabList" role="tablist" runat="server">
<li id="result1" role="presentation" runat="server"><a href="#Section7" aria-controls="home" role="tab" data-toggle="tab">Patient Information</a></li>
<li id="result2" role="presentation" runat="server" ><a href="#Section8" aria-controls="home" role="tab" data-toggle="tab">Financially Responsible Party</a></li>
<li role="presentation" ><a href="#Section9" aria-controls="home" role="tab" data-toggle="tab">Emergency Contact</a></li>
</ul>
<!-- Tab panes -->
<div class="tab-content tabs">
<!-- Patient Information -->
<div role="tabpanel" runat="server" id="Section7">
<table width="100%" align="center" >
<tr><td colspan="4">
<table width="100%" class="w3-card w3-table w3-small">
<tr>
<td>
<asp:UpdatePanel ID="UpdatePanel16" runat="server" UpdateMode="Conditional"><ContentTemplate>
<table width="100%" class="w3-card w3-table w3-small">
<tr><td ><label >Patient Name </label><asp:TextBox class="w3-input w3-border w3-round" TabIndex="7" ID="txt_PatientName" runat="server" ValidationGroup="ADD" Width="200px"></asp:TextBox>
</td><td align="left"><label >Contact Number </label>
<asp:TextBox class="w3-input w3-border w3-round" ID="txt_Cnumber" TabIndex="8" runat="server" ValidationGroup="ADD" Width="200px"></asp:TextBox>
</td>
</tr>
<tr>
<td colspan="4" style="text-align:right" align="right"><asp:Button
ID="but_Submit" runat="server" Text="Register" ValidationGroup="ADD"
CssClass="w3-btn w3-blue w3-padding-large w3-hover-red"
OnClick="but_Submit_Click"
TabIndex="23"></asp:Button>
</td>
</tr>
</table>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="but_Submit"
EventName="Click" />
</Triggers>
</asp:UpdatePanel>
</td>
</tr>
</table>
</td></tr>
</table>
</div>
<!-- Financially Responsible Party -->
<div role="tabpanel" runat="server" id="Section8">
<table width="100%" align="center" >
<tr><td colspan="4">
<table width="100%" class="w3-card w3-table w3-small">
<tr><td ><label >Financial Bearer Name </label>
<asp:TextBox class="w3-input w3-border w3-round"
TabIndex="7" ID="txt_fbname" runat="server"
ValidationGroup="ADD1" Width="200px"></asp:TextBox>
</td><td align="left"><label >Relation to Patient </label>
<asp:TextBox class="w3-input w3-border w3-round" ID="txt_rtp"
TabIndex="8" runat="server" ValidationGroup="ADD1" Width="200px">
</asp:TextBox>
</td>
<td align="left" ><label >Date of Birth </label><asp:TextBox
class="w3-input w3-border w3-round" ID="txt_fbdob" runat="server"
TabIndex="15" ValidationGroup="ADD1" Width="200px"></asp:TextBox>
<cc1:CalendarExtender CssClass= "cal_Theme1" ID="CalendarExtender1"
runat="server" Enabled="True" Format="dd-MMM-yyyy"
PopupButtonID="txt_fbdob" TargetControlID="txt_fbdob">
</cc1:CalendarExtender>
</td>
<td align="left"><label >Occupation</label><asp:TextBox class="w3-input w3-border w3-round" ID="txt_occptn" runat="server" TabIndex="20" ValidationGroup="ADD1" Width="200px"></asp:TextBox>
</td>
</tr>
<tr>
<td colspan="4" style="text-align:right" align="right"><asp:Button
ID="Button6" runat="server" Text="SAVE" ValidationGroup="ADD"
CssClass="w3-btn w3-blue w3-padding-large w3-hover-red"
OnClick="but_Submit1_Click" TabIndex="23"></asp:Button>
</td>
</tr>
</table>
</td>
</tr>
</table>
</div>
<!--End Financially Responsible Party -->
<!--Emergency Contact -->
<div role="tabpanel" class="tab-pane fade" id="Section9">
<table width="100%" align="center" >
<tr><td colspan="4">
<table width="100%" class="w3-card w3-table w3-small">
<tr><td ><label >Contact Name </label><asp:TextBox class="w3-
input w3-border w3-round" TabIndex="7" ID="txt_emname" runat="server"
ValidationGroup="ADD2" Width="200px"></asp:TextBox>
</td><td align="left"><label >Relation to Patient </label>
<asp:TextBox class="w3-input w3-border w3-round" ID="txt_emrtp"
TabIndex="8" runat="server" ValidationGroup="ADD2" Width="200px">
</asp:TextBox>
</td>
<td align="left"><label >Mobile Number </label><asp:TextBox class="w3-input w3-border w3-round" ID="txt_emmob" runat="server" TabIndex="12" ValidationGroup="ADD2" Width="200px"></asp:TextBox>
</td><td ><label >Office Phone </label><asp:TextBox class="w3-input w3-border w3-round" ID="txt_emofpnum" TabIndex="13" runat="server" ValidationGroup="ADD2" Width="200px"></asp:TextBox>
</td>
<td align="left" ><label>Home Phone </label><asp:TextBox class="w3-input w3-border w3-round" ID="txt_emhmpnum" runat="server" TabIndex="14" ValidationGroup="ADD2" Width="200px"></asp:TextBox>
</td>
</tr>
<tr>
<td colspan="4" style="text-align:right" align="right"><asp:Button ID="Button7" runat="server" Text="SAVE" ValidationGroup="ADD" CssClass="w3-btn w3-blue w3-padding-large w3-hover-red"
OnClick="but_Submit2_Click" TabIndex="23"></asp:Button>
</td>
</tr>
</table>
</td>
</tr>
</table>
</div>
</div>
</div>
</div>
</div>
</div>
Page Load Event
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
username = Session["user"].ToString();
}
result1.Attributes.Add("class", "active");
Section7.Attributes.Add("class", "tab-pane active");
//hide the tab (menu and content)
Section8.Attributes.Remove("class");
Section8.Attributes.Add("class", "tab-pane");
result2.Attributes.Remove("class");
result2.Attributes.Add("class", "nav nav-tabs");
ScriptManager scriptManager = ScriptManager.GetCurrent(this.Page);
scriptManager.RegisterPostBackControl(this.btn_CoverttoPDF);
}
Button Click Event
protected void but_Submit_Click(object sender, EventArgs e)
{
//code for inserting data//
//switching code
result2.Attributes.Add("class", "active");
Section8.Attributes.Add("class", "tab-pane active");
//hide the personal tab (menu and content)
Section7.Attributes.Remove("class");
Section7.Attributes.Add("class", "tab-pane");
result1.Attributes.Remove("class");
result1.Attributes.Add("class", "nav nav-tabs");
}
`
答案 0 :(得分：0)
function pageLoad(sender, args) {
if (args.get_isPartialLoad()) {
$(".nav-tabs a").click(function () {
$(this).tab('show');
});
}
}
答案 1 :(得分：-1)
请参阅以下示例：
<div class="row">
<div class="col-md-6" style="width:100%;margin-top:50px">
<div class="tab" id="Tabs" role="tabpanel">
<!-- Nav tabs -->
<ul class="nav nav-tabs" id="TabList" role="tablist" runat="server">
<li id="result1" role="presentation" runat="server"><a href="#Section7" aria-controls="home" role="tab" data-toggle="tab">Patient Information</a></li>
<li id="result2" role="presentation" runat="server"><a href="#Section8" aria-controls="home" role="tab" data-toggle="tab">Financially Responsible Party</a></li>
<li role="presentation"><a href="#Section9" aria-controls="home" role="tab" data-toggle="tab">Emergency Contact</a></li>
</ul>
</div>
</div>
<button onclick="onButtonClick()">Register</button>
</div>
<script>
function onButtonClick() {
document.getElementById('result2').classList.add("active");
document.getElementById('Section8').classList.add("tab-pane active");
//hide the personal tab (menu and content)
document.getElementById('Section7').className = '';
document.getElementById('Section7').classList.add("tab-pane");
document.getElementById('result1').className = '';
document.getElementById('result1').classList.add("nav nav-tabs");
}
</script>