防止Boostrap模式关闭后LinkBut​​ton点击内部模式

Question

我得到了一个LinkBut​​ton内的一个带有一个ClickFunction在codeBehind中的boostrap模式。每当我点击linkBut​​ton并且代码隐藏事件正在触发时，模式正在关闭。我想在链接按钮点击后保持模式打开！

检查ASP LinkBut​​ton的内模上标签模体与Click事件：

<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> 

LinkBut​​ton的点击功能在后面的代码：

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

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

我只是想保持模式打开一次LinkBut​​ton的被点击

Answer 1

我发现了解决方案！答案是：当您使用UPDATE PANEL并且发生回发时，回发在更新面板内的所有控件中执行，并且如果模式html代码位于更新面板内，则当回发发生时，模式将被“刷新”并重新设置为默认值（即处于关闭状态），所以如果您想要在回发后保持模式打开，则应该在更新面板中编写此代码，每次在更新面板中执行此回发操作时，代码模式不被“感动”，“重写道：”通过回传。

Answer 2

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

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

Answer 3

您需要设置模式属性像下面，防止消失模态弹出：

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

Answer 4

您可以使用引导模式或者与URL操作的jQuery到后面的代码方法或使用的ScriptManager更新面板。

Web窗体：

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

后面的代码：

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

的jQuery：

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); 
} 
}); 
} 

第二种方法使用更新面板

的WebForm：

<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> 

012背后

代码：因为它是没有任何变化

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

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

的jQuery：

$(document).on('click', '#<%=link.ClientID%>', function (event) { 
     event.preventDefault(); 
    }); 

事件。的preventDefault（）;对于

要防止回发的，因为我们是ASP.Net TextBox控件所以如果我们使用输入html元素发生，有是没有必要使用“e.preventDefault（）”作为posback不会发生。