Как предотвратить дефолт для каждого объекта?Только первый работал - PullRequest
1 голос
/ 11 марта 2019

У меня проблемы с предотвращением действия по умолчанию для каждого объекта Event.Каждое событие должно показывать ссылку с идентификатором класса «ajax-event».А для ссылок с таким идентификатором должна быть выполнена функция protectDefault ().

Вот код в моем файле Event.js

function listenForEvent() {
 $('#ajax-event').on('click', function(event) {
  console.log('you just hit event')
  event.preventDefault()
 });
};

А вот итерация в моих событиях # index.htmlfile:

<tr><!--this will list the details of the column name-->
  <% @events.each do |event| %>
    <% if event.event_guests.any? {|guest| !guest.rsvp }%>
      <td><%= link_to "#{event.name}", user_event_path(@user, event), id: "ajax-event", class: "ajax-event"  %></td>
      <td><%= event.location %></td>
      <td><%= event.date.strftime("%b %d, %Y") %></td>
      <td><%= link_to "Edit", edit_user_event_path(@user, event) %></td>
      <td><%= link_to "Delete", user_event_path(@user, event), method: :delete %></td>
</tr>
    <% end %>
  <% end %>

Это действие предотвращение утечки () работало только с первым объектом события.Любая помощь приветствуется!

1 Ответ

2 голосов
/ 11 марта 2019

Несколько элементов с одинаковым идентификатором в одном документе являются недействительными HTML - при выборе $('#ajax-event') jQuery просматривает только первый элемент с идентификатором ajax-event.Удалите дубликаты идентификаторов (я не вижу здесь никакой необходимости в каких-либо идентификаторах) и используйте вместо этого ваш (уже существующий) класс ajax-event:

function listenForEvent() {
  $('.ajax-event').on('click', function(event) {
    console.log('you just hit event')
    event.preventDefault()
  });
}
...