none
Mantener datos de tabla tras postback. RRS feed

  • Pregunta

  • Buenas tardes, les comento:

    tengo una tabla html generada dinamicamente en una funcion con mas de 3000 registros de mi bbdd, cada fila generada tiene un boton para eliminar la fila seleccionada. El problema viene cuando borro un registro ya que al hacer el postback tengo que volver a generar toda la tabla para que no me salga vacia.

    ¿Hay alguna forma de mantener los datos de la tabla tras el refresco?

    Gracias.

    domingo, 11 de octubre de 2015 18:37

Respuestas

  • ¿Hay alguna forma de mantener los datos de la tabla tras el refresco?

    Si es un html generado dinámicamente en el lado servidor, entonces no tienes más remedio que volverlo a generar a cada postback. Cuando usas un GridView para que éste a su vez genera la tabla, aparentemente parece que se mantiene la tabla a cada postback, pero en realidad el código servidor que implementa internamente el GridView vuelve a generar el Table a cada PostBack (a costa de leer los datos desde el ViewState, con lo que éste puede legar a ocupar un tamaño considerable). Si la tabla la generas tú mismo, entonces tienes que hacer tú lo mismo que haría el GridView internamente, y generar la tabla usando código propio a cada postback.

    La solución, si no quieres estar enviando la tabla todo el rato al navegador, es no hacer postbacks. Para ello, se utiliza código AJAX a base de escribir javascript en el lado cliente, de manera que cada vez que pulsas el "borrar" de un registro se envía una llamadita AJAX al servidor para borrarlo de la base de datos, y se borra la fila de la tabla en el lado cliente usando javascript.

    • Marcado como respuesta Adm1990 domingo, 11 de octubre de 2015 20:18
    domingo, 11 de octubre de 2015 19:59
  • [...] no consigo evitar el postback del boton.

    Una forma de evitar que el botón haga postback es hacer un "return false" desde el click:

    <asp:Button ID="miboton" CssClass="clickme" runat="server" Text="actualizar" OnClientClick="return llamada();" /> y dentro de llamada pon al final un "return false;".

    Otra forma es conectar el evento mediante jQuery (en lugar del onClientClick) y hacer dentro una llamada a e.preventDefault(). La diferencia con el return false es que el preventDefault solo impide que el botón haga un submit, pero no impide que el click burbujee a sus contenedores.

    • Marcado como respuesta Adm1990 miércoles, 14 de octubre de 2015 7:13
    martes, 13 de octubre de 2015 7:26
  • [...] estoy buscando ejemplo de llamadas mediante webservice, pero todos son con static o shared.

    A la vista del código que has puesto en otro mensaje, veo que estás haciendo la llamada desde jQuery. Cuando mencionaste lo del método static o shared, pensé que estabas usando el ScriptManager en lugar de jQuery. Si fuera así, el ScriptManager sabe hacer la llamada al webmethod. Hay un artículo que o explica aquí:

    https://msdn.microsoft.com/en-us/library/bb515101(v=vs.90).aspx

    Al principio del artículo hay una larga explicación teórica, pero puedes bajar hasta donde está el ejemplo, que es bastante sencillo.

    Si en lugar de usar el ScriptManager quieres hacer la llamada con jQuery, acuérdate de decorar el WebMethod con [ScriptService] y hacer la llamada usando JSON. Hacerla con SOAP (el protocolo predeterminado para el WebService) es sumamente complicado.

     
    • Marcado como respuesta Adm1990 miércoles, 14 de octubre de 2015 7:13
    martes, 13 de octubre de 2015 7:43

Todas las respuestas

  • ¿Hay alguna forma de mantener los datos de la tabla tras el refresco?

    Si es un html generado dinámicamente en el lado servidor, entonces no tienes más remedio que volverlo a generar a cada postback. Cuando usas un GridView para que éste a su vez genera la tabla, aparentemente parece que se mantiene la tabla a cada postback, pero en realidad el código servidor que implementa internamente el GridView vuelve a generar el Table a cada PostBack (a costa de leer los datos desde el ViewState, con lo que éste puede legar a ocupar un tamaño considerable). Si la tabla la generas tú mismo, entonces tienes que hacer tú lo mismo que haría el GridView internamente, y generar la tabla usando código propio a cada postback.

    La solución, si no quieres estar enviando la tabla todo el rato al navegador, es no hacer postbacks. Para ello, se utiliza código AJAX a base de escribir javascript en el lado cliente, de manera que cada vez que pulsas el "borrar" de un registro se envía una llamadita AJAX al servidor para borrarlo de la base de datos, y se borra la fila de la tabla en el lado cliente usando javascript.

    • Marcado como respuesta Adm1990 domingo, 11 de octubre de 2015 20:18
    domingo, 11 de octubre de 2015 19:59
  • Hola alberto antes de nada muchas gracias por responder, el tema de ajax lo descarte en un primer momento ya que la web que tengo que modificar tiene muchas partes programadas de antes (mucho codigo) y para llamar a la funcion borrar mediante ajax tendria que convertir el metodo a share y por lo tanto la mayoria de los objetos que tiene esa funcion me dan error porque no lo son.

    Pero visto lo visto tendre que reprogramar todo de nuevo.

    Gracias.

    domingo, 11 de octubre de 2015 20:18
  • [...] para llamar a la funcion borrar mediante ajax tendria que convertir el metodo a share [...]


    No necesariamente. Podrías convertirlo a un webservice, en el que los métodos son de instancia, y el AJAX de Microsoft lo puede llamar de forma casi idéntica a las llamadas a los métodos Shared. O podrías prescindir del AJAX de Microsoft y hacer al AJAX con otra librería como por ejemplo jQuery, o incluso directamente con el XmlHttpRequest, en cuyo caso puedes llamar prácticamente a cualquier cosa, incluyendo un aspx o un ashx, donde los métodos siguen siendo de instancia y no Shared.
    lunes, 12 de octubre de 2015 6:54
  • Gracias por contestar una vez mas alberto, estoy buscando ejemplo de llamadas mediante webservice, pero todos son con static o shared.

    ¿Podrias ponerme un ejemplo simple sin usar estos?

    Pd: yo lo intento pero debugueando no entra al metodo.

    Gracias.

    lunes, 12 de octubre de 2015 12:28
  • Hola de nuevo, pongo un ejemplo que estoy tratando de hacer, pero no consigo evitar el postback del boton.


       <script>
            function llamada() {

                $.ajax({
                    type: "POST",
                    url: 'servicioadm.asmx/HelloWorld',
                    data: "{}",
                    contentType: "application/json; charset=utf-8",
                    dataType: "json",
                    success: function (data) {}

                });


            };

        </script>

    Mi boton es:

      <asp:Button ID="miboton" CssClass="clickme" runat="server" Text="actualizar" OnClientClick="llamada()" />

    Y mi metodo del webservice:

    <WebMethod()> _
        Public Function HelloWorld() As String
            Return "Hola a todos"
        End Function


    • Editado Adm1990 lunes, 12 de octubre de 2015 14:48
    lunes, 12 de octubre de 2015 14:47
  • [...] no consigo evitar el postback del boton.

    Una forma de evitar que el botón haga postback es hacer un "return false" desde el click:

    <asp:Button ID="miboton" CssClass="clickme" runat="server" Text="actualizar" OnClientClick="return llamada();" /> y dentro de llamada pon al final un "return false;".

    Otra forma es conectar el evento mediante jQuery (en lugar del onClientClick) y hacer dentro una llamada a e.preventDefault(). La diferencia con el return false es que el preventDefault solo impide que el botón haga un submit, pero no impide que el click burbujee a sus contenedores.

    • Marcado como respuesta Adm1990 miércoles, 14 de octubre de 2015 7:13
    martes, 13 de octubre de 2015 7:26
  • [...] estoy buscando ejemplo de llamadas mediante webservice, pero todos son con static o shared.

    A la vista del código que has puesto en otro mensaje, veo que estás haciendo la llamada desde jQuery. Cuando mencionaste lo del método static o shared, pensé que estabas usando el ScriptManager en lugar de jQuery. Si fuera así, el ScriptManager sabe hacer la llamada al webmethod. Hay un artículo que o explica aquí:

    https://msdn.microsoft.com/en-us/library/bb515101(v=vs.90).aspx

    Al principio del artículo hay una larga explicación teórica, pero puedes bajar hasta donde está el ejemplo, que es bastante sencillo.

    Si en lugar de usar el ScriptManager quieres hacer la llamada con jQuery, acuérdate de decorar el WebMethod con [ScriptService] y hacer la llamada usando JSON. Hacerla con SOAP (el protocolo predeterminado para el WebService) es sumamente complicado.

     
    • Marcado como respuesta Adm1990 miércoles, 14 de octubre de 2015 7:13
    martes, 13 de octubre de 2015 7:43
  • Ok muchas gracias alberto!
    miércoles, 14 de octubre de 2015 7:13