Как передать текст из представления в javascript

Question 1

Привет, у меня проблема с Rails и Javascript. Вот моя таблица.

<table>
  <thead>
    <tr>
      <th>No</th>
      <th>Name</th>
    </tr>
  </thead>
  <tbody>
      <tr id="adminrow">
        <td>
          1
        </td>
        <td>
          <a href="#" id="select_name">John</a>
        </td>
      </tr>
      <tr id="adminrow">
        <td>
          2
        </td>
        <td>
          <a href="#" id="select_name">Alex</a>
        </td>
      </tr>
      <tr id="adminrow">
        <td>
          3
        </td>
        <td>
          <a href="#" id="select_name">Paul</a>
        </td>
      </tr>
  </tbody>
</table>

А мой JS

$('#select_name').click(function(event){
    var username = $("#select_name").text();
    console.log(username);
});

В моей таблице много имен, но JS напечатал имя в консоли. Как я могу вывести каждое имя в таблице на консоль?

javascript ruby-on-rails haml

0

Neo Teo 26 Июн 2016 в 12:03

Что вы пытаетесь решить?

–

uzaif

26 Июн 2016 в 12:07

2

В файле js используйте это var username = $(this).text(), надеюсь, это сработает

–

uzaif

26 Июн 2016 в 12:08

Я имею в виду, что данные таблицы находятся в цикле, я хочу, чтобы все данные передавались в JS. Пример Имя похоже на John, Alex, Wade, Paul ... var username похоже на John, Alex, Wade, Paul. Но сейчас напечатан только Джон.

–

Neo Teo

26 Июн 2016 в 12:14

Answer

Вы создаете в каждом цикле N ссылок (по количеству пользователей) с одним и тем же идентификатором select_name. Ваш javascript не понимает, какой из них выбрать. Попробуйте добавить идентификатор пользователя в свой html select_name идентификатор и соответствующим образом скорректируйте свой javascript. То же самое и с другим вашим идентификатором adminrow.

ИЛИ просто измените свой select_name на класс, а не идентификатор:

 ....
 %a{:href=>"#", :class=>"select_name"}=u.firstname
 ....
 $('.select_name').click(function(event){ ....

Хорошо, прилагаю для вас полный код. Для меня это работает нормально. Например. печатает только имя после нажатия на соответствующую ссылку:

<table>
<thead>
  <tr>
    <th>No</th>
    <th>Name</th>
  </tr>
</thead>
<tbody>
    <tr class="adminrow">
      <td>
        1
      </td>
      <td>
        <a href="#" class="select_name">John</a>
      </td>
    </tr>
    <tr class="adminrow">
      <td>
        2
      </td>
      <td>
        <a href="#" class="select_name">Alex</a>
      </td>
    </tr>
    <tr class="adminrow">
      <td>
        3
      </td>
      <td>
        <a href="#" class="select_name">Paul</a>
      </td>
    </tr>
</tbody>
</table>

<script type="text/javascript">
  $('.select_name').click(function(event){
    var username = $(this).text();
    console.log(username);
  });
</script>

2

26 Июн 2016 в 13:23

Как я могу это сделать?

–

Neo Teo

26 Июн 2016 в 12:31

@NeoTeo: Скорректировал ответ.

–

user4776684

26 Июн 2016 в 12:33

Спасибо, но все данные печатаются одновременно. Я хочу напечатать каждое имя, щелкнув по именам

–

Neo Teo

26 Июн 2016 в 12:56

@NeoTeo: как @uzaif указал в комментариях, вам следует использовать var username = $(this).text(). Я думал, что вы уже заметили эту ошибку.

–

user4776684

26 Июн 2016 в 13:01

@NeoTeo: Я только что добавил к ответу полный код. Тестирование показывает, что все работает нормально. Проверьте / сравните с вашим кодом еще раз.

–

user4776684

26 Июн 2016 в 13:15

Question 2

Вы создаете в каждом цикле N ссылок (по количеству пользователей) с одним и тем же идентификатором select_name. Ваш javascript не понимает, какой из них выбрать. Попробуйте добавить идентификатор пользователя в свой html select_name идентификатор и соответствующим образом скорректируйте свой javascript. То же самое и с другим вашим идентификатором adminrow.

ИЛИ просто измените свой select_name на класс, а не идентификатор:

 ....
 %a{:href=>"#", :class=>"select_name"}=u.firstname
 ....
 $('.select_name').click(function(event){ ....

Хорошо, прилагаю для вас полный код. Для меня это работает нормально. Например. печатает только имя после нажатия на соответствующую ссылку:

<table>
<thead>
  <tr>
    <th>No</th>
    <th>Name</th>
  </tr>
</thead>
<tbody>
    <tr class="adminrow">
      <td>
        1
      </td>
      <td>
        <a href="#" class="select_name">John</a>
      </td>
    </tr>
    <tr class="adminrow">
      <td>
        2
      </td>
      <td>
        <a href="#" class="select_name">Alex</a>
      </td>
    </tr>
    <tr class="adminrow">
      <td>
        3
      </td>
      <td>
        <a href="#" class="select_name">Paul</a>
      </td>
    </tr>
</tbody>
</table>

<script type="text/javascript">
  $('.select_name').click(function(event){
    var username = $(this).text();
    console.log(username);
  });
</script>

2

26 Июн 2016 в 13:23

Как я могу это сделать?

–

Neo Teo

26 Июн 2016 в 12:31

@NeoTeo: Скорректировал ответ.

–

user4776684

26 Июн 2016 в 12:33

Спасибо, но все данные печатаются одновременно. Я хочу напечатать каждое имя, щелкнув по именам

–

Neo Teo

26 Июн 2016 в 12:56

@NeoTeo: как @uzaif указал в комментариях, вам следует использовать var username = $(this).text(). Я думал, что вы уже заметили эту ошибку.

–

user4776684

26 Июн 2016 в 13:01

@NeoTeo: Я только что добавил к ответу полный код. Тестирование показывает, что все работает нормально. Проверьте / сравните с вашим кодом еще раз.

–

user4776684

26 Июн 2016 в 13:15

Как передать текст из представления в javascript

1 ответ

Похожие вопросы

Новые вопросы

javascript