单击 ASP:Button 停止 Bootstrap 手风琴关闭

Question

下面是在我的 ASPX 页面上显示手风琴的代码：

单击手风琴中的某个项目时，该面板会按预期展开。该面板包含许多 ASP 控件（按钮等）。单击按钮时，代码隐藏成功执行。

但是页面也刷新了，手风琴关闭了

谁能告诉我如何在单击按钮时阻止手风琴关闭？

<div class="panel-group" id="accordion">
    <div class="panel panel-default">
        <div class="panel-heading">
            <h4 class="panel-title">
                <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion" href="#collapseOne">News</a>
            </h4>
        </div>
        <div id="collapseTwo" class="panel-collapse collapse">
            <div class="panel-body">
                <!--Update News Section-->
                <div class="col-md-12">
                    <div class="panel panel-default">
                        <div class="panel-heading">
                            <h3>Post Latest News</h3>
                        </div>

                        <div class="panel-body">
                            <div class="col-lg-12">
                                <textarea id="myTextarea" runat="server"></textarea>
                            </div>
                            <asp:Button Text="Save" OnClick="btnSaveNews_Click" ID="btnSaveNews" runat="server" />
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

这里还有代码隐藏：

    protected void btnSaveNews_Click(object sender, EventArgs e)
{
    String strConnString = System.Configuration.ConfigurationManager.ConnectionStrings["BallinoraDBConnectionString1"].ConnectionString;
    SqlConnection con = new SqlConnection(strConnString);
    //====== Getting connection string defined in the web.config file. Pointed to the database we want to use.
    //   SqlConnection con = new SqlConnection(ConfigurationManager.ConnectionStrings["EmployeeConnection"].ConnectionString);

    //======= Insert Query.
    string cmdText = "INSERT INTO News (News_Content, News_Date) VALUES (@Content, @Date)";

    //====== Providning information to SQL command object about which query to 
    //====== execute and from where to get database connection information.
    SqlCommand cmd = new SqlCommand(cmdText, con);

    //===== Adding parameters/Values.
    cmd.Parameters.AddWithValue("@Content", myTextarea.Value);
    cmd.Parameters.AddWithValue("@Date", DateTime.Now);


    //===== To check current state of the connection object. If it is closed open the connection
    //===== to execute the insert query.
    if (con.State == ConnectionState.Closed)
    {
        con.Open();
    }

    //===== Execute Query.
    cmd.ExecuteNonQuery();

    //===== close the connection.
    con.Close();

    //===== Clear text from textboxes
    // clearInputControls();

    //===== Bind data to repeater.
    // bindEmployeeDetailsToRepeater();
}

Answer 1

最简单的方法是用 UpdatePanel 将手风琴中的内容包裹起来。现在，如果单击 btnSaveNews，您可以更改 myTextarea 的内容而无需完整的 PostBack，因此手风琴将在同一位置保持打开状态

<div class="panel panel-default">

    <asp:UpdatePanel ID="UpdatePanel1" runat="server">
        <ContentTemplate>

            <div class="panel-heading">
                <h3>Post Latest News</h3>
            </div>

            <div class="panel-body">
                <div class="col-lg-12">
                    <textarea id="myTextarea" runat="server"></textarea>
                </div>
                <asp:Button Text="Save" OnClick="btnSaveNews_Click" ID="btnSaveNews" runat="server" />
            </div>

        </ContentTemplate>
    </asp:UpdatePanel>

</div>

如果有 none，您需要在该页面上放置一个 ScriptManager。

<asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>

PS 而不是 textarea 我推荐 ASP TextBox with TextMode MultiLine.

<asp:TextBox ID="myTextarea" runat="server" TextMode="MultiLine"></asp:TextBox>

单击 ASP:Button 停止 Bootstrap 手风琴关闭

Stop Bootstrap Accordion from Closing on ASP:Button Click

html

c#

asp.net

bootstrap-accordion