manejando eventos de controles (ajax) dentro de un Repeater

No con mucho tiempo, voy a ser breve en algunas cosas, pero este post ya esta mucho tiempo en cola :p. Si tienen alguna duda con algo del post, lo dejan en los comentarios, y lo aclaramos.

Como ustedes saben para mostrar data personalizada y masiva en ASP.NET, aparte del GridView, tenemos el control DataList y Repeater. Porque usar uno y otro, es tema de otra discusión, y cuando haya algún tiempito lo posteo.

El caso es, que estoy usando un Repeater para mostrar noticias, pero se me presento el requerimiento de poder puntuar una noticia. Nosotros sabemos que ya fue liberado ASP.NET AJAX, pero además sabemos que también fue liberado ASP.NET AJAX Control Toolkit, y dentro de ellos un control muy útil para este tipo de casos: el control Rating.

Y lo quiero lograr al final es esto:

Por cierto este será ahora mi site demo, para todas las cosas que muestre, reconocen el fondo?. Como ustedes saben nosotros podemos responder a eventos de un botón dentro del Datalist o Repeater. Pueden revisar este artículo también: Custom Buttons in the DataList and Repeater.

Pero el ligero problema es que el control Rating no es un botón, pero si maneja eventos, y nos aprovecharemos de eso responder al evento de este control producido dentro del Repater. Primero, agregamos el control Rating a nuestra página aspx:

  1. Agregamos un control ScriptManager.
  2. Agregamos la directiva Register a la cabecera de la página:

    <%@ Register
        Assembly=”AjaxControlToolkit”
        Namespace=”AjaxControlToolkit”
        TagPrefix=”ajaxToolkit” %>

  3. Ahora agregamos el control UpdatePanel. Ojo, no incluir todo el control Repeater dentro del UpdatePanel, lo colocaremos dentro del elemento ItemTemplate del Reapater, agregamos el UpdatePanel y control Rating:

      <asp:UpdatePanel ID=”upnlPuntuar” runat=”server”>
         <ContentTemplate>
            <span class=”contenido_negrita”>Puntuar Noticia: </span>
            <ajaxToolkit:Rating ID=”ratNoticia” runat=”server” CurrentRating=”0″
                Tag='<%# Eval(“notCod”) %>’
                MaxRating=”10″ StarCssClass=”ratingStar”
                WaitingStarCssClass=”savedRatingStar”
                FilledStarCssClass=”filledRatingStar”
                EmptyStarCssClass=”emptyRatingStar”
                OnChanged=”ratNoticia_Change”
                Style=”float: left;” />
         </ContentTemplate>
      </asp:UpdatePanel>
      </p>
    </ItemTemplate>

Con eso ya tenemos en diseño el control dentro de nuestra página, sólo falta una incógnita, como manejar el evento. Si ven la declaración del control Rating, ya habrán notado como será, usando la poderosísima propiedad Tag. Manejando eventos de un botón dentro del Repeater se hace usando el evento ItemCommand del control Repeater, se hace esto para poder saber sobre que fila se hizo el evento, pero al manejar los controles sus propios eventos, se pierde esto, es por eso que nosotros usaremos la propiedad Tag, para almacenar el código de la noticia, de tal manera que cuando se dispare este evento, sepamos sobre cuál noticia ocurrio. Ahora simplemente vamos al código y hacemos lo siguiente:

   protected void ratNoticia_Change(object source, RatingEventArgs e)
   {
       //recuperar la puntación y el código de la noticia.
       
int puntuacion = int.Parse(e.Value);
       int codNot = int.Parse(e.Tag);

       EnviarPuntuacion(codNot, puntuacion); 
   }

Será que es casualidad, que agregaron la propiedad Tag al RatingEventArgs ¿?. Casualidad o no, nos sirve, y muy bien. En el método EnviarPuntuacion, ya ustedes hacen la votación, dependiendo si sólo es para usuarios registrados, para usuarios anónimos, si evito doble votación usando cookies, o usando IP, podemos agregar todas las validaciones que necesitemos, y agregar funcionalidad de nuestra propia lógica de negocios.

Saludos,

Post cruzado 3Dev Blogs

5 comentarios en “manejando eventos de controles (ajax) dentro de un Repeater”

  1. Asi es, lo importante es también probarlo en los diversos escenarios para que pase todas las validaciones y pruebas respectivas :), y se vaya mejorando mucho más.

    Saludos,

  2. Buenas, tengo un repeater y dentro de este tengo un datagrid y en una de las celdas del datagrid tengo un boton, mi pregunta es, como puedo ponerle una accion a ese boton?, por decir: enviar un mensaje o algo por el estilo, kiero detectar el evento click del boton, de antemano gracias, saludos…

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *