Asp.net bootstrap modal popup не работает правильно

Question

Я пытаюсь использовать строку строки сетки asp.net для модального всплывающего окна, ее работа для предупреждения, но не могу вызвать модальное всплывающее окно, как я могу его исправить?

<div id="confirm" class="modal hide fade"> 
    <div class="modal-body"> 
    Are you sure? 
    </div> 
    <div class="modal-footer"> 
    <button type="button" data-dismiss="modal" class="btn btn-primary" id="delete">Delete</button> 
    <button type="button" data-dismiss="modal" class="btn">Cancel</button> 
    </div> 
</div> 

---

<asp:Button ID="btnDeletes" ToolTip="Delete" CommandArgument="<%# Container.DataItemIndex %>" OnClick="btnDelete_Click1" OnClientClick="test();" 
                   CssClass="GridDeletebtn" runat="server" /> 

---

<script> 
function test() 
{ 
    $('#confirm').show(); 
    alert('df'); 
} 
</script> 

Answer 1

Когда вы звоните, alert('df'), поток будет заблокирован до тех пор, пока вы не нажмете кнопку «ОК» оповещения, после чего последует обратная передача.

Но когда вы показываете только модальный диалог (без alert), он не будет блокировать поток, и, следовательно, postback произойдет немедленно.

Следовательно, ваш модальный диалог исчезнет после обратной передачи.

Когда вы добавляете `return false ', как показано ниже, он остановит обратную передачу.

<asp:Button ID="btnDeletes" ToolTip="Delete" CommandArgument="<%# Container.DataItemIndex %>" OnClick="btnDelete_Click1" OnClientClick="test();return false;" CssClass="GridDeletebtn" runat="server" /> 

Script

<script> 
    function test() 
      { 
       $('#confirm').modal('show'); 
       //alert('df'); 
      } 
     </script> 

Html

<div id="confirm" class="modal hide fade" tabindex="-1" role="dialog"> 
    <div class="modal-body"> 
    Are you sure? 
    </div> 
    <div class="modal-footer"> 
    <button type="button" data-dismiss="modal" class="btn btn-primary" id="delete">Delete</button> 
    <button type="button" data-dismiss="modal" class="btn">Cancel</button> 
    </div> 
</div> 

Answer 2

Если вы можете поделиться URL, что я могу проверить. Тогда я попробую. Кроме того, попробуйте поймать имя класса вместо id. некоторые вещи как указано ниже.

$ ('. Modal'). Show();

Answer 3

, если вы используете GridView или повторитель затем вызвать модальное всплывающее окно с помощью ниже кода его работы для меня

<a class="btn btn-sm btn-warning" data-toggle="modal" data-target="#Remark_Modal<%# Eval("PrimaryID")%>"> 
    <i class="fa fa-eye"></i>&nbsp;Details 
</a> 

<!--Modal--> 
<div class="modal fade" id='Remark_Modal<%# Eval("PrimaryID")%>' role="dialog" aria-hidden="true"> 
    <div class="modal-dialog modal-lg"> 
     <div class="modal-content card-blue-fill"> 
      <div class="modal-header card-header"> 
       <button type="button" class="modal-close" data-dismiss="modal" aria-label="Close"> 
        <i class="fa fa-2x fa-close"></i> 
       </button> 
       <h4 class="modal-title"><i class="fa fa-eye"></i>&nbsp; <%# Eval("MissionName")%></h4> 
      </div> 
      <div class="modal-body card-block"> 
       <%# Eval("Remark")%> 
      </div> 
     </div> 
    </div> 
</div>