0

非常感谢您的帮助——
我花了几个小时在这里和通过谷歌阅读各种答案，一定忽略了一些东西。

我正在将JQuery Tabs（JQuery 1.9.1 / JQuery UI 1.10.3）与 Asp.Net 一起使用，并希望在回发时维护选定的选项卡。
选项卡位于UpdatePanel.
活动：<%= 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更改 a 文本的事件label。thedropdownlist和 thelabel都在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:";
    }
}
4

2 回答 2

0

我最终为每个选项卡链接编写了单独的函数。如下：

<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>

感谢 Aristos 的帮助，您为我的 Google 搜索提供了一些额外的措辞，帮助我解决了这个问题。

于 2013-06-21T03:21:39.183 回答
0

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

于 2013-06-20T07:37:52.580 回答