防止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不會發生。