Jquery Tab集Hiddenfield值
我们非常感谢你的帮助--
我已经花了几个小时在这里和通过谷歌阅读各种各样的答案，肯定是忽略了什么。
我使用JQuery Tabs (JQuery 1.9.1 / JQuery UI 1.10.3)和Asp.Net，并希望在回发时维护选定的选项卡。
选项卡在UpdatePanel中。
active：<%= hdnSelectedTab.Value %>部分正在工作，因为我可以手动设置hiddenfield的值，并且在回发时选中该选项卡。
但是，我无法更改hiddenfield的值。
我的JavaScript是：
<script type="text/javascript">
$(function () {
$("#tabs").tabs({
show: function() {
var sel = $('#tabs').tabs('option', 'active');
$("#<%= hdnSelectedTab.ClientID %>").val(sel);
},
active: <%= hdnSelectedTab.Value %>
});
})
</script>我的标签结构是：
<asp:ScriptManager ID="scriptmanager" runat="server" />
<asp:UpdatePanel runat="server" ID="tabpnl">
<ContentTemplate>
<tr>
<td colspan="4">
<br />
<div id="tabs">
<ul>
<li><a href="#tab-1" runat="server" id="tab1id">Tab1</a></li>
<li><a href="#tab-2" runat="server" id="tab2id">Tab2</a></li>
<li><a href="#tab-3" runat="server" id="tab3id">Tab3</a></li>
<li><a href="#tab-4" runat="server" id="tab4id">Tab4</a></li>
</ul>
<asp:HiddenField ID="hdnSelectedTab" runat="server" Value="0" />
<div id="tab-1">
<table id="transaction2">
<tr>
<td id="tdpmt1" runat="server">
<asp:Label ID="lblpmt1" runat="server" Text="Payment 1" CssClass="header" /></td>
</tr>
....more code....编辑对亚里士多德的回应
我输入了你的密码但没有运气。回发仍然将选定的选项卡重置为第一个选项卡。我用于测试的回发的触发器是一个带有dropdownlist事件的OnSelectedIndexChanged，该事件会更改label的文本。dropdownlist和label都在UpdatePanel中。这是代码：
<asp:DropDownList ID="invoicestatusddl" runat="server" CssClass="dropdown" AutoPostBack="true" OnSelectedIndexChanged="invoicestatusddl_SelectedIndexChanged">
<asp:ListItem Text="Invoiced" Value="1" Selected="True" />
<asp:ListItem Text="Future" Value="0" />
</asp:DropDownList>和
protected void invoicestatusddl_SelectedIndexChanged(object sender, EventArgs e)
{
if (invoicestatusddl.SelectedValue == "0")
{
lblinvdate.Text = "Future Invoice Date:";
}
else
{
lblinvdate.Text = "Date Invoiced:";
}
}回答 2
Stack Overflow用户
发布于 2013-06-21 03:21:39
最后，我为每个选项卡链接编写了单独的函数。详情如下：
<script>
function changeHidden0(){
document.getElementById("hdnSelectedTab").value = 0;
}
function changeHidden1(){
document.getElementById("hdnSelectedTab").value = 1;
}
function changeHidden2(){
document.getElementById("hdnSelectedTab").value = 2;
}
function changeHidden3(){
document.getElementById("hdnSelectedTab").value = 3;
}
</script>感谢亚里士多德的帮助，你给了我一些额外的措辞，我的谷歌搜索帮助我弄清楚这一点。
Stack Overflow用户
发布于 2013-06-20 07:37:52
只有在第一次加载页面时才运行javascript部分，并在那里设置一次所选选项卡。
现在，在每次使用UpdatePanel的Ajax更新时，都不会运行相同的脚本。为了使其运行，您需要使用基于这个原因而存在的UpdatePanel javascript函数。
最简单的是pageLoad，使用它初始化您的代码，它就可以工作了。
function pageLoad()
{
$("#tabs").tabs({
show: function() {
var sel = $('#tabs').tabs('option', 'active');
$("#<%= hdnSelectedTab.ClientID %>").val(sel);
},
active: <%= hdnSelectedTab.Value %>
});
}参考资料：http://msdn.microsoft.com/en-us/library/bb386417(v=vs.100).aspx
https://stackoverflow.com/questions/17205143
复制相似问题
腾讯云开发者
