Executar Modal Bootstrap pelo Code-Behind [ASP.NET]

Neste artigo, irei mostrar como executamos um modal pelo code-behind no ASP.NET, para aquelas caixas de mensagens quando surgem algum erro do Try por exemplo...

Primeiro vamos adicionar o modal do bootstrap no HTML;

   <div id="mymodals1" class="modal fade" tabindex="-1" role="dialog" aria-hidden="true">  
           <div class="modal-dialog" role="document">  
             <div class="modal-content">  
               <div class="modal-header">  
                 <h5 class="modal-title">  
                   <asp:Label Text="Erro Inesperado!" ID="Label1" runat="server" /></h5>  
                 <button type="button" class="close" data-dismiss="modal" aria-label="Close">  
                   <span aria-hidden="true">&times;</span>  
                 </button>  
               </div>  
               <div class="modal-body">  
                 <asp:Label Text="MENSAGEM_AQUI" ID="Label2" runat="server" />  
               </div>  
               <div class="modal-footer">  
                 <asp:Button runat="server" ID="button2" type="button" Text="Entendi!!" class="btn btn-primary" data-dismiss="modal"></asp:Button>  
               </div>  
             </div>  
           </div>  
         </div>  

Agora no code-behind iremos adicionar o seguinte código; (criei uma try para lançar um erro propositalmente)

    protected void Button1_Click(object sender, EventArgs e)  
     {  
       try  
       {  
         string d = "asd";  
         int t = Convert.ToInt32(d);  
       }  
       catch (Exception ex)  
       {  
         ErroLog("Erro Inesperado", ex.Message, "");  
       }  
     }  

     // Aqui criei um Método especifico para isso
     public void ErroLog(string titulo, string message, string button)  
     {  
       Label1.Text = titulo;  
       Label2.Text = message;  
       Page.ClientScript.RegisterStartupScript(GetType(), key: "script", script: "<script>$('#mymodals1').modal('show');</script> ", addScriptTags: false);  
     }  

Repare que no <div id="mymodals1" é idêntico ao mymodals1 no code-behind, e será isso quer usará para identificar o modal que será executado.

Não esqueça de adicionar as referencias;

    <script src="Scripts/jquery-3.0.0.js"></script>

    <script src="Scripts/bootstrap.js"></script>

COMENTE

& Compartilhe

Tweet