none
Interaccion UpdatePanel con JQuery RRS feed

  • Pregunta

  • Buen día. Espero alguien pueda orientarme con una duda. Muchas gracias de antemano.

    Resulta que tengo un Botón, al que le agregué un UpdatePanel de ésta manera.

                    <asp:UpdatePanel ID="UpdatePanel1" runat="server">
                        <ContentTemplate>
                            <asp:Button ID="BtnAgregar" CssClass="BotonOK" Text="Add" runat="server" OnClick="BtnAgregar_Click" />
                        </ContentTemplate>
                    </asp:UpdatePanel>
    

    Tengo además un UpdateProgress que me servirá para mostrar la imagen de espera al usuario en lo que la pantalla está actualizándose desde el servidor.

    <asp:UpdateProgress ID="UpdateProgress1" runat="server" DisplayAfter="0" AssociatedUpdatePanelID="UpdatePanel1"> <ProgressTemplate> <div class="overlay" /> <div class="overlayContent"> <h2>Espere por favor...</h2> <img src="../../Images/Gifs/ajax-loader-7.gif" alt="Loading" border="1" /> </div> </ProgressTemplate>

       </asp:UpdateProgress>

    Al inicio de mi Content de la página actual, tengo el ScriptManager que debe acompañar a éstos objetos.

        <asp:ScriptManager ID="ScriptManager1" runat="server">
    La cuestión es que, también tengo un código en JQuery para hacer algunas validaciones previas que evitan que se realice el PostBack en caso de encontrar algún fallo en los datos ingresados por el usuario.

    $("#MainContent_BtnAgregar").click(function (event) {

    //Validaciones, Validaciones y más validaciones })

    En caso de que alguna validación no se cumpla, JQuery ejecuta un preventDefault() para detener la ejecución de la página.

    Si alguna validación no se cumple, JQuery intercepta el llamado y detiene la ejecución de la página (Es decir, no va al servidor) pero si todo está correcto, se realiza el PostBack y se muestra la imágen, pero ahí termina todo... la página no va al servidor, y obviamente la imagen de espera jamás se quita.

    Al debuggear la ejecución en local de los scripts que se invocan al presionar el botón, veo que salta una excepción en el MicrosoftAjaxWebForms.js que dice: TypeError: Sys.WebForms.Res is undefined.

    Saben a qué se debe??

    Muchas gracias!


    lunes, 13 de julio de 2020 17:52

Todas las respuestas

  • No sé por qué salta esa excepción en concreto, pero sí te puedo decir un problema importante que tiene tu diseño y que va a hacer que no funcione correctamente, incluso aunque arregles ese error.

    La cuestión es que la forma en la que funciona el UpdatePanel es que durante los postbacks parciales el servidor transmite al navegador un fragmento de HTML que reemplaza lo que hubiera previamente dentro del UpdatePanel antes de hacer el postback parcial. Al reemplazar el HTML, se perderán todos los eventos que tuvieras conectados al botón, salvo que los vuelvas a reconectar durante el postback. Pero en tu caso, el click lo conectas mediante un jquery que seguramente no se vuelve a ejecutar durante el postback, así que el evento se desconecta. Por tanto solo funcionará la primera vez, antes de que se produzca un postback parcial.

    lunes, 13 de julio de 2020 18:15
  • hola

    >>En caso de que alguna validación no se cumpla, JQuery ejecuta un preventDefault() para detener la ejecución de la página.

    javascript y jquery se lleva pesimo con los controles de asp.net y mas aun con el UpdatePanel, el camino que estas tomando solo es para dolor de cabeza

    Recomendaria que o te adaptas al update panel y trabajas con la logica de asp.net o descartas todo lo que son controles de asp.net y usas jquery al completo con $.ajax

    Es un camino u otro, no los mezcles porque puedo asegurarte que te pateen la entrepierna duele menos que meterse en ese berenjenal

    porque crees que se usa asp.net mvc en la actualidad dejando obsoleto a asp.net y sus webcontrols, justamente por esto que te comento

    saludos


    Leandro Tuttini

    Blog
    MVP Profile
    Buenos Aires
    Argentina


    lunes, 13 de julio de 2020 20:17
  • Soy neófito en el uso del UpdatePanel. Lo que busco hacer es que, mientras el servidor está procesando la respuesta, necesito mostrarle al usuario un indicador de que la página está trabajando en su solicitud. No necesito mandar un fragmento del HTML, en realidad necesito que se haga el Postback completo para que se ejecute la instrucción. Según te entiendo, el UpdatePanel es un control que sólo actualiza la porción de código embebido en éste, es por esto que de acuerdo a lo que me comentas, los eventos enlazados a éste botón mediante JQuery se perderán... creo que lo entiendo. Pero entonces, ¿Tú sabes cómo puedo hacer lo que quiero? (Mostrar el UpdateProgress mientras la página completa hace PostBack) suena a que debería encerrar todo el form dentro del propio UpdatePanel... no?

    Muchas gracias!!

    lunes, 13 de julio de 2020 20:17
  • hola

    >>En caso de que alguna validación no se cumpla, JQuery ejecuta un preventDefault() para detener la ejecución de la página.

    javascript y jquery se lleva pesimo con los controles de asp.net y mas aun con el UpdatePanel, el camino que estas tomando solo es para dolor de cabeza

    Recomendaria que o te adaptas al update panel y trabajas con la logica de asp.net o descartas todo lo que son controles de asp.net y usas jquery al completo con $.ajax

    Es un camino u otro, no los mezcles porque puedo asegurarte que te pateen la entrepierna duele menos que meterse en ese berenjenal

    porque crees que se usa asp.net mvc en la actualidad dejando obsoleto a asp.net y sus webcontrols, justamente por esto que te comento

    saludos


    Leandro Tuttini

    Blog
    MVP Profile
    Buenos Aires
    Argentina


    Hola Leandro, muchas gracias por tu recomendación... Te comento que he tenido que lidiar un poco con el tema de JQuery usando los WebControls de ASP y efectivamente, a veces son engorrosos. Tengo poco conocimiento sobre MVC, trataré de meterme un poco, por lo demás, dado que mi proyecto ya está en camino y bastante avanzado, no me queda más remedio que seguir adelante con el esquema que vengo trabajando. Revisaré si después con calma puedo migrar a un esquema mejor como el que me propones.

    Saludos!

    lunes, 13 de julio de 2020 20:37
  • hola

    >>Tengo poco conocimiento sobre MVC, trataré de meterme un poco

    Lo recomiendo, te va a gustar

    Mas que nada por el control y el orden que se aplica en el codigo, ademas es super compatible con librerias como ser jquery o es mas, si quieres evolucionar tambien deberias ir a Angular o React

    Son las herramientas que se usan actualmente y se piden en la industria, asp.net ya no se aplica en ningun proyecto nuevo que vayas a empezar en cualquier empresa seria

    saludos


    Leandro Tuttini

    Blog
    MVP Profile
    Buenos Aires
    Argentina

    lunes, 13 de julio de 2020 22:16
  • Hola

    ¿Te han funcionado las respuestas? Si nos puedes actualizar tu estado, sería genial!

    Saludos

    miércoles, 15 de julio de 2020 13:14
    Moderador