Как создать функцию JS на динамически генерируемой таблице Rails

Question

Я пытаюсь создать функцию JS для увеличения числа голосов на странице, что я обычно делаю, записывая Document.getElementByID, а затем записывая идентификатор, но в Rails я пытаюсь выяснить,Как написать эту функцию, где строки таблицы создаются динамически в цикле.Как мне создать функцию для этого?

Вот цикл html rails:

  <tbody>
    <% @requests.each do |request| %>
      <tr>
        <td><%= request.artist %></td>
        <td><%= request.title %></td>
        <td><%= request.voteCount %></td>
        <td><button onclick="upVote()">Vote</button></td>
      </tr>
    <% end %>
  </tbody>

Answer 1

У вас есть несколько вариантов: если вы хотите придерживаться своего обработчика onclick, просто передайте идентификатор запроса в вашу функцию upVote ().Это может выглядеть так:

<td><button onclick="upVote(<%= request.id %>)">Vote</button></td>

Затем в вашей функции JS upVote(requestID) сделайте все, что нужно, чтобы сделать этот запрос, и соответственно обновите свой пользовательский интерфейс.

Другой, превосходный, вариант будет использовать встроенную в Rails remote link_to helper , которая работает на rails-ujs.Вот как это может выглядеть:

<td><%= link_to 'Vote', [:upvote, request], remote: true, method: :post, class: 'upvote' %></td>

Обратите внимание, что я использую метод POST, поскольку действия, которые имеют побочные эффекты, не должны выполняться с помощью запроса GET.Удостоверьтесь, что вы соответственно направили.

Затем в вашем RequestsController:

def upvote
  request = Request.find(params[:id])
  request.upvote! # Or do whatever you need to do to upvote it

  # Respond to your JS request with whatever updated info it might need to update the UI
  render json: { voteCount: request.voteCount } } 
end

Наконец, в JS (записанном как CoffeeScript):

$('a.upvote').on 'ajax:success', (event) ->
  # Update your UI to reflect the upvote (you can access the JSON returned from your upvote action here to make necessary updates)