Question

我在一个boostrap模式中有一个LinkButton，在codeBehind中有一个ClickFunction。每次我点击linkButton并且代码隐藏中的事件被触发时，模态正在关闭。我想在链接按钮点击后保持模态打开！

使用Click事件检查标记 modal-body 上的模式内的asp LinkButton：

<div class="modal fade" id="modalPesquisaCliente" tabindex="-1" role="dialog">
                    <div class="modal-dialog">
                        <div class="modal-content">
                            <div class="modal-header">
                                <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Fechar</span></button>
                                <h4 class="modal-title" id="txtTitle"><i>&nbsp;Pesquisa de Clientes</h4>
                            </div>
                            <div class="modal-body">
                                <asp:LinkButton runat="server" ID="link" OnClick="link_Click">aaa</asp:LinkButton>
                                <asp:Label ID="lbl" runat="server"></asp:Label>
                            </div>
                            <div class="modal-footer">
                                <button type="button" class="btn btn-default" data-dismiss="modal">Ok</button>
                            </div>
                        </div>
                    </div>
                </div>

LinkButton Click代码Behind：

中的函数

 protected void link_Click(object sender, EventArgs e)
    {
        lbl.Text = "aaa";
    }

问题是：每次我点击模态内的链接按钮，其中有一个在代码隐藏中点击事件，模态正在关闭？

我只是想在点击链接按钮后保持模态打开

Answer 1

正如你提到的jQuery，试试这个

 $(document).on('click', '#link', function (event) {
            event.preventDefault();
        });

Answer 2

您需要设置如下所示的模态属性以防止模态弹出消失：

$('#modalPesquisaCliente').modal({
  backdrop: 'static',
  keyboard: false
})

Answer 3

我找到了解决方案的人！答案是：

“当您使用UPDATE PANEL并发出回发时，回发会在更新面板内的所有控件中执行，如果modals html代码在更新面板内，当回发发生时，模态将”刷新“并设置为默认值再次（这是处于关闭状态），所以如果你想在回发后保持模态打开，你应该写这个html代码OUT更新面板，每次在更新面板内发布回发时这样做，模态的代码不是通过回复“感动”和“重写”。

Answer 4

您可以使用bootstrap模型将jQuery与URL操作一起使用到您的代码隐藏方法或使用与Scriptmanager一起使用的更新面板。

web窗体：

bar : Nat
bar = onlyModBy5 4

代码背后：

<asp:Button ID="link" runat="server" OnClientClick="callAjaxMethod(event)"  Text="Call method using Ajax" />

jQuery的：

[System.Web.Services.WebMethod]
public static bool link_Click()
{
return "aaa";
}

使用更新面板的第二种方法

web窗体：

function callAjaxMethod(e) {

e.preventDefault();

$.ajax({
type: "POST",
url: "SimpleAjax.aspx/IsLeapYear",
data: '',
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (response) {
  if (response.d) {
     $('#<%=lbl.ClientID%>').val(response.d);
  }
  else {
    $('#<%=lbl.ClientID%>').val('No value');
  }
},
failure: function (response) {
  $('#<%=lbl.ClientID%>').val("Error in calling Ajax:" + response.d);
}
});
}

代码背后：因为它没有变化

<asp:ScriptManager ID="ScriptManager1" runat="server">
    </asp:ScriptManager>
    <asp:UpdatePanel ID="UpdatePanel1" runat="server">
        <ContentTemplate>
            <fieldset>
            <div class="modal fade" id="modalPesquisaCliente" tabindex="-1" role="dialog">
                <div class="modal-dialog">
                    <div class="modal-content">
                        <div class="modal-header">
                            <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Fechar</span></button>
                            <h4 class="modal-title" id="txtTitle"><i>&nbsp;Pesquisa de Clientes</h4>
                        </div>
                        <div class="modal-body">
                            <asp:LinkButton runat="server" ID="link" OnClick="link_Click">aaa</asp:LinkButton>
                            <asp:Label ID="lbl" runat="server"></asp:Label>
                        </div>
                        <div class="modal-footer">
                            <button type="button" class="btn btn-default" data-dismiss="modal">Ok</button>
                        </div>
                    </div>
                </div>
            </div>
            </fieldset>
        </ContentTemplate>
    </asp:UpdatePanel>

使用一个非常简单的方法而不使用jquery或更新面板，你可以使用简单的jQuery来实现。

jQuery的：

 protected void link_Click(object sender, EventArgs e)
 {
    lbl.Text = "aaa";
 }

event.preventDefault（）;对

防止回发发生，因为我们是ASP.Net TextBox控件所以如果我们使用了输入 html元素，那么就不需要使用'e.preventDefault（）'因为后卫不会发生。

LinkButton单击内部模态

4 个答案:

LinkBut​​ton单击内部模态

4 个答案:

LinkButton单击内部模态