0

私は3つのタブを持っています-そして最後のタブにはupdatepanelasp.netがあります：

<div id='tab3' class="tab-panel">
            <h3>
                Filter</h3>
            <asp:UpdatePanel ID="updFilters" runat="server">
                <ContentTemplate>
                    <asp:DropDownList ID="ddlFilterSelect" runat="server" AutoPostBack="true" OnSelectedIndexChanged="ddlFilterSelect_SelectedIndexChanged"></asp:DropDownList>
                    <asp:ListBox ID="lstFilterSelect" runat="server" SelectionMode="Single" AutoPostBack="true" OnSelectedIndexChanged="lstFilterSelect_SelectedIndexChanged"></asp:ListBox>
                    <asp:Button ID="btnReset" runat="server" Text="Reset Filter" OnClick="btnReset_Click" />
                </ContentTemplate>
            </asp:UpdatePanel>
        </div>

updatepanelには、ajax呼び出しで選択リストボックスを変更する選択ボックスを備えたフィルター機能があります。フィルタを実行すると、コンテンツが表示されなくなり、最初のタブが選択されますが、コンテンツは表示されないままになります。3つのタブをもう一度クリックすると、コンテンツが再表示されます。

ここでタブjqueryコードとhtmlを見つけてください：http：//jsfiddle.net/zidski/LQKSt/

4

1 に答える 1

0

あなたがする必要があるのは、更新パネルサーバー側のイベントが発生したときにjqueryイベントを再度登録することです。

ScriptManager.RegisterScriptを使用して、次のようなイベントを再登録します

ボタンクリックでScriptManager.RegisterScriptを使用してこのReRegister（）を呼び出し、ドロップダウンで選択したインデックスを変更します。

function ReRegister()
{
// Tabs
$('ul.tabs').each(function () {
    // For each set of tabs, we want to keep track of
    // which tab is active and it's associated content
    var $active, $content, $links = $(this).find('a');

    // Use the first link as the initial active tab
    $active = $links.first().addClass('active');
    $content = $($active.attr('href'));

    // Hide the remaining content
    $links.not(':first').each(function () {
        $($(this).attr('href')).hide();
    });

    // Bind the click event handler
    $(this).on('click', 'a', function (e) {
        // Make the old tab inactive.
        $active.removeClass('active');
        $content.hide();

        // Update the variables with the new link and content
        $active = $(this);
        $content = $($(this).attr('href'));

        // Make the tab active.
        $active.addClass('active');
        $content.show();

        // Prevent the anchor's default click action
        e.preventDefault();
    });
});
}

また、クリックイベントが発生した後、3番目のタブを明示的に開く必要がある場合があります。

ScriptManager自体で、これを呼び出すことができます

// Open third tab
$('#tabs ul').tabs('select', 2);
于 2012-08-09T12:38:53.003 に答える