gistfile1.txt

-- Dentro de la plantilla

<div id="votos">
{{ contexto.imagen.numVotos }}
</div>

<input type="submit" action="JSDeMasAbajo">Votar

--JSDeMasAbajo
<pseudocodigo>
Si se pulsa el boton
  * Se llama a url /votar/id_image
  * Se recarga el id="votos" //el del contexto de mas arriba
</pseudocodigo>

--El controlador
Public function votarAction()
{
   * hace un update en la base de datos sumando 1 a los votos
   * Recarga el contexto
   * No devuelve plantilla alguna
}

A ver, te digo cómo lo pienso yo. Lo primero, eso de contexto, fuera, ya que lo devuelves en el controlador que llama a esa plantilla devolviendo la instancia de imagen en el array, así que sería simplemente {{imagen.numVotos}}. Bien, y ahora vamos a la parte AJAX. Al pulsar un botón se generará un evento que hace una llamada AJAX para actualizar esa información en BBDD. Bien, eso por un lado, hasta aquí más o menos sencillo y lógico. Ahora lo que quieres es que se actualice el contador de la página. Tienes que tener en cuenta de que la página ya está generada, por lo que ya no está lo de {{imagen.numVotos}}, sino que pondrá simplemente

5

. Bien, ahora tienes dos opciones, hacer un simple +1 cuando se pulse el botón de "Votar", con lo que sería muy sencillo, aprovechando el evento del botón, sólo haces un +1 al contador usando la función $ de jQuery. El problema de esto es que no contrastas la información de BBDD, sólo tienes en cuenta el voto del usuario actual. Otra opción es aprovechar también el evento del botón para hacer otra llamada AJAX (o igual en la misma de la update se puede devolver info) para que te de el numVotos, pero realmente esto no es mucho mejor que lo del +1, pq puede que le des al botón y en el ejemplo, en vez de poner un 6 pues ponga un 8 pq han votado otros 2 usuarios a la vez que tú, pero ahí queda todo, si siguen votando tú no te enteras hasta q refresques la página. Así que otra opción es tener un evento temporizado que use una acción AJAX para ir refrescando el item. Espero haberme explicado :)