Otras Páginas

Expandir Todo

Permitir Votar

Objetivos

    Ahora vamos a agrear un botón para que la gente pueda hacer clic para votar.

Pasos

Paso 1: Agregar una nueva acción al controlador para votar

Edita app/controllers/topics_controller.rb para agregar un método como éste:

def upvote
  @topic = Topic.find(params[:id])
  @topic.votes.create
  redirect_to(topics_path)
end
  • @topic = Topic.find(params[:id]) encuentra el tema en la base de datos con ese id y lo almacena en la variable @topic.
  • @topic.votes.create crea un nuevo voto para el tema actual y lo guarda en la base de datos.
  • redirect_to(topics_path) le dice al navegador que regrese a topics_path (la lista de temas).

Paso 2: Agrega una nueva ruta para votar

Abre config/routes.rb y encuentra la sección que se ve como esta:

resources :topics

Reemplaza esa línea para que quede como ésta:

resources :topics do
  member do
    post 'upvote'
  end
end

Verifica que la ruta fue agregada exitosamente revisando en la salida de rake routes o http://localhost:3000/rails/info. Deberías ver una línea como ésta:

      Prefix Verb   URI Pattern                  Controller#Action
upvote_topic POST   /topics/:id/upvote(.:format) topics#upvote

Paso 3: Agrega el botón a la lista

Edita app/views/topics/index.html.erb para que el ciclo final se vea como esto:

<% @topics.each do |topic| %>
  <tr>
    <td><%= topic.title %></td>
    <td><%= topic.description %></td>
    <td><%= pluralize(topic.votes.count, "vote") %></td>
    <td><%= button_to '+1', upvote_topic_path(topic), method: :post %></td>
    <td><%= link_to 'Show', topic %></td>
    <td><%= link_to 'Edit', edit_topic_path(topic) %></td>
    <td><%= link_to 'Destroy', topic, method: :delete, data: { confirm: 'Are you sure?' } %></td>
  </tr>
<% end %>
  • pluralize(topic.votes.count, "vote") muestra el número de votos que tiene el tema, mas la palabra 'vote' o 'votes' correspondiente.
  • button_to '+1' crea un botón html con el texto '+1'.
  • topic_upvote_path(topic) crea la URL apropiada para la acción que queremos invocar. En este caso, queremos aumentar la cantidad de votos del tema actual.
    • topic_upvote_path(topic) regresaría /topics/42/upvote (si topic.id fuera 42)
  • method: :post asegura de que ejeutamos la acción crear del CRUD, no la acción leer.

Paso 4: Confirmar los cambios en el navegador

Regresa a http://localhost:3000/topics y juega.

Deléitate con el hecho de que no tuviste que reiniciar el servidor para ver los cambios. Conveniente, ¿no?

Deploying

¡Antes del siguiente paso, podrias tratar de lanzar tu app a Heroku!