防止从ASP NET按钮关闭Modal

Cobi 发表于 Dev

科比

对于我的ASP Webforms应用程序，我使用Bootstrap中的Modal进行设置。

<asp:Button CssClass="btn btn-default" data-toggle="modal" data-target="#myModal" OnClientClick="return false;" runat="server" Text="Einstellungen" />

如您所见，我已经必须阻止Button进行回发。因为如果我单击按钮，模态打开，回发开始，模态关闭。

所以我解决了这个问题。

但是现在，如果我打开模态并想在此模态中单击一个按钮：

 <asp:Button runat="server" ID="dropbox" Text="Mit Dropbox anmelden" CausesValidation="false" OnClick="dropboxButton" CssClass="btn btn-info" />

模态关闭...但是，我希望用户看到他填写的Accountinformation信息。另外，在单击“ +”按钮后，我还有一个用于添加条目的字段。每次单击添加后，模态将被关闭...

我已经尝试过data-backdrop =“ static”以及使用Javascript和e.preventDefault（）;的东西；

有任何想法吗？

丹尼斯·韦塞尔斯

点击一个服务器端的ASP.NET按钮控件会导致回发，你的页面将重新加载，因此该模式将closed.What你能做的就是拨打以下Click事件中的代码重新开模后的点击事件：

后面的代码：

protected void btnClickMe_Click(object sender, EventArgs e)
{
    lblTest.Text = DateTime.Now.ToString("dd MMM yyyy - HH:mm:ss");
    ScriptManager.RegisterStartupScript(this, this.GetType(), "Pop", "showModal();", true);
}

.ASPX：

<head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.3/jquery.min.js"></script>
    <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
    <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" />
    <script type="text/javascript">
        function showModal() {
            $('#myModal').modal('show');
        }

        $(function () {
            $("#btnShowModal").click(function () {
                showModal();
            });
        });
    </script>
</head>
<body>
    <form id="form1" runat="server">
        <input type="button" id="btnShowModal" value="Show Modal" />
        <div id="myModal" class="modal fade"">
            <div class="modal-dialog">
                <div class="modal-content">
                    <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                        <h4 class="modal-title" id="myModalLabel">Modal popup</h4>
                    </div>
                    <div class="modal-body">
                        <asp:Label ID="lblTest" runat="server"></asp:Label>
                    </div>
                    <div class="modal-footer">
                        <asp:Button ID="btnClickMe" runat="server" Text="Click Me" OnClick="btnClickMe_Click" />
                    </div>
                </div>
            </div>
        </div>
    </form>
</body>