none
Problema al intentar mostrar ventanas modales C# RRS feed

  • Pregunta

  • Hola a todos!, estoy teniendo problemas a la hora de mostrar ventanas modales Bootstrap en un proyecto nuevo.

    Estuve investigando y me topé con que tenía en desorden la secuencias de los comandos (las referencias Jquery deben estar incluidas antes de los archivos de complemento), y el orden me quedó así:

        <!-- MIS CSS-->
        <link href="css/miEstilo.css" rel="stylesheet" />
        <link href="css/Funciones.css" rel="stylesheet" />
        <link href="css/Grilla.css" rel="stylesheet" />
        <!-- Jquery -->
        <script src="Scripts/jquery-3.3.1.min.js"></script>
        <!-- Bootstrap core CSS-->
        <link href="vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet" />
        <!-- Bootstrap min JS-->
        <script src="vendor/bootstrap/js/bootstrap.min.js"></script>
    
        <!-- Custom fonts for this template-->
        <link href="vendor/font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css" />
        <!-- Page level plugin CSS-->
        <link href="vendor/datatables/dataTables.bootstrap4.css" rel="stylesheet" />
        <!-- Custom styles for this template-->
        <link href="css/sb-admin.css" rel="stylesheet" />
    
        <script src="js/miJS.js"></script>
        <!-- Bootstrap Modal -->
        <script type="text/javascript" src="vendor/bootstrap/js/bootstrap.js"></script>

    Aspx de mi Ventana modal:

    <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalCenterTitle" aria-hidden="true">
                            <div class="modal-dialog modal-dialog-centered" role="document">
                                <asp:ScriptManager runat="server" />
                                <asp:UpdatePanel ID="upModal" runat="server" ChildrenAsTriggers="false" UpdateMode="Conditional">
                                    <ContentTemplate>
                                        <div class="modal-content">
                                            <div class="modal-header">
    
                                                <h5 class="modal-title">
                                                    <asp:Label ID="lblTituloModal" runat="server" Text=""></asp:Label></h5>
                                                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                                    <span aria-hidden="true">&times;</span>
                                                </button>
                                            </div>
    
                                            <div class="modal-body">
                                                <p style="text-align: justify">
                                                    <asp:Label ID="lblCuerpoModal" runat="server" Text=""></asp:Label>
                                                </p>
                                            </div>
    
                                            <div class="modal-footer">
                                                <asp:Button ID="btnAceptar" runat="server" Text="Aceptar" CssClass="btn btn-primary" OnClick="btnAceptar_Click" />
                                            </div>
                                        </div>
                                    </ContentTemplate>
                                </asp:UpdatePanel>
                            </div>
                        </div>

    En el .cs:

    lblTituloModal.Text = "Texto";
    lblCuerpoModal.Text = "Texto ";
    ScriptManager.RegisterStartupScript(Page, Page.GetType(), "myModal", "openModal();", true);
    upModal.Update();

    Mi archivo .js:

    function openModal() {
        $('#myModal').modal('show');
    }

    Lo raro es que en otro proyecto que tengo funciona perfectamente, y he copiado todo a la perfección, no se que me podría estar faltando, ¿alguna idea al respecto? 

    Muchas gracias por su atención! Saludos


    • Editado AguFortini lunes, 1 de abril de 2019 13:56
    lunes, 1 de abril de 2019 13:56

Todas las respuestas

  • hola

    Si revisas la Console del Developer tools del browser (accedes con F12) observas algun mensaje de error en javascript ?

    Esta linea

    upModal.Update();

    para que se utiliza ?

    saludos


    Leandro Tuttini

    Blog
    MVP Profile
    Buenos Aires
    Argentina

    lunes, 1 de abril de 2019 14:15
  • Hola Leandro! gracias por tu pronta respuesta. En consola me aparece lo siguiente:

    Uncaught ReferenceError: $ is not defined at openModal (miJS.js:4)

    Y con respecto a la línea:

    upModal.Update();

    Lo que hace es actualizar el contenido del UpdatePanel (que contiene la ventana modal). Es código que encontré en Internet para hacer funcionar las modales, y en el otro proyecto me anda perfecto, ni me aparece el error anterior

    lunes, 1 de abril de 2019 14:28