停止引导手风琴面板在表单提交时折叠答案

【问题标题】：Stop bootstrap accordion panel collapsing on form submit停止引导手风琴面板在表单提交时折叠
【发布时间】：2015-01-20 10:28:30
【问题描述】：

我在 Bootstrap 3 可折叠面板中有一个表单。

表单是一个带有 EDIT 和 DELETE 按钮的 asp.net DetailsView 控件。

当我单击 EDIT 时，面板折叠，我需要再次单击它以重新打开它并完成编辑。

EDIT 按钮单击事件导致面板关闭。

为什么？我该如何预防？

这是标记（注意：手风琴在 UpdatePanel 内）：

<div class="panel panel-default">
    <div class="panel-heading" role="tab" id="headingTwo">
         <h4 class="panel-title">
            <a class="collapsed" data-toggle="collapse" data-parent="#accordion" href="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo">Associated Person Details
            </a>
              </h4>

    </div>
    <div id="collapseTwo" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingTwo">
        <div class="panel-body">
            <asp:DynamicValidator runat="server" ID="DynamicValidator5" ControlToValidate="dvPartnerDetails" Display="None" EnableClientScript="true" />
             <h4>Partner details:</h4>

            <asp:DetailsView ID="dvPartnerDetails" runat="server" CssClass="detailstable" FieldHeaderStyle-CssClass="bold" AutoGenerateRows="false" DefaultMode="ReadOnly" EnableModelValidation="true" OnDataBound="dvPartnerDetails_DataBound" DataSourceID="dsPartnerDetails" DataKeyNames="PersonID">
                <Fields>
                    <asp:DynamicField DataField="PartnerTitle" />
                    <asp:DynamicField DataField="PartnerForenames" />
                    <asp:DynamicField DataField="PartnerInitials" />
                    <asp:DynamicField DataField="PartnerSurname" />
                    <asp:DynamicField DataField="PartnerAddressee" />
                    <asp:DynamicField DataField="PartnerSalutation" />
                </Fields>
                <FieldHeaderStyle CssClass="bold" />
                <FooterTemplate>
                    <div class="bottomhyperlink">
                        <asp:LinkButton ID="EditHyperLink" CausesValidation="false" CssClass="btn btn-default" runat="server" CommandName="Edit">Edit</asp:LinkButton>
                        <asp:LinkButton ID="DeleteButton" runat="server" CssClass="btn btn-default" CausesValidation="false" CommandName="Delete" OnClientClick='return confirm("Are you sure you want to delete this record?");' Text="Delete" />
                    </div>
                </FooterTemplate>
            </asp:DetailsView>
        </div>
    </div>
</div>

【问题讨论】：

标签： javascript jquery html twitter-bootstrap updatepanel

【解决方案1】：

问题是updatepanel总是带上原代码，需要重新打开手风琴。

<script type='text/javascript'>
    $(document).ready(function() {
        Sys.WebForms.PageRequestManager.getInstance().add_endRequest(endRequestHandler);
    });

    function endRequestHandler(sender, args)
    {
        $('#collapseTwo').collapse.in()
    }
</script>

【讨论】：

有道理，谢谢保罗。但是，我该如何在 (document).ready 上做到这一点？
您缺少第一个 function 的 )。即使添加了那个，我仍然有同样的问题。
浏览器控制台显示的错误是Uncaught TypeError: undefined is not a function。
你是不是用的boostrap js太对了？不仅是css。
我试过 alert("this should work"); 而不是 $('#collapseTwo').collapse.in() 并且它有效，所以它必须是未定义的 jquery 或其他东西。

【解决方案2】：

这可能对其他人有帮助。

达到预期效果的正确方法如下：

<script type='text/javascript'>
        $(document).ready(function() {
            Sys.WebForms.PageRequestManager.getInstance().add_endRequest(endRequestHandler);
        });

        function endRequestHandler(sender, args)
        {
         $('#collapseTwo').addClass('in');
        }
</script>

【讨论】：

【解决方案3】：

这个解决方案有效，但我需要一个更灵活的解决方案，它不假设哪个手风琴是打开的。请参阅我在另一个问题中发布的解决方案：

https://stackoverflow.com/a/36363024/4047526

【讨论】：