Блог

Главная - Вопросы по программированию - Как использовать data-attribute для передачи значений из базы данных в jquery

Как использовать data-attribute для передачи значений из базы данных в jquery

#javascript #php #html #jquery #wordpress-theming

#javascript #php #HTML #jquery #wordpress-тематизация

Вопрос:

У меня возникла проблема с передачей значений из базы данных в модальное всплывающее окно с использованием атрибута data.

Моя проблема в том, что значение атрибута данных передает только одно значение, тогда как кнопка редактирования находится в цикле php и должна выбирать значение для каждой строки.

Ниже приведена часть моего кода цикла:

 <td>
  <p data-placement="top" data-toggle="tooltip" title="Edit">
    <a  href="<?php echo admin_url('admin.php?page=woocommerce_checkoutamp;id=' . $query->id.'amp;status=update'); ?>"  
      class="btn btn-primary btn-xs updatesection"  
      data-title="Edit"
      data-toggle="modal"
      data-id="<?php echo $query->id ?>"
      data-target="#editbilling" 
      data-name="<?php echo $query->name; ?>">Edit</a>
  </p>
</td>

js

    $(document).on( "click", '#editbilling', function(e) {

     var data = $('.updatesection').data('name');
     alert(data);
   });

Итак, я тестирую значения, передаваемые через атрибут data, предупреждая его на javascript.

Проблема в том, что только первая id отправляется для всех кнопок редактирования в цикле с разными идентификаторами вместо отправки разных идентификаторов для каждой строки в базе данных.

Когда я просматриваю код в браузере, я обнаруживаю, что атрибуты данных имеют соответствующие значения из базы данных, но они не отправляются — только первая строка отправляется для всех кнопок редактирования в цикле.

Кто-нибудь может найти исправление для этого, пожалуйста

Комментарии:

1. $('.updatesection').data('name') возвращает data-name значение первого .updatesection элемента на странице.

2. Но как мне вернуть все строки базы данных вместо только первой

3. Как вы отправляете? A <form> ? Или a $.post ? Если a form , данные-атрибуты вообще не публикуются, поэтому должен быть какой-то другой способ получить их на входе. Если a $.post , то как вы сопоставляете свои данные?

4. я не отправляю форму. Это кнопка в таблице, которая получает значения из базы данных в цикле. Кнопка редактирования при нажатии должна получать соответствующие элементы строки, используя атрибут data, но она получает только первый элемент строки, например, название компании. Если вы нажмете кнопку редактирования во второй строке, она по-прежнему выдает данные из строки 1 вместо получения значений из строки 2

5. @MoritzRingler ваш ответ выводит все значения на экран одним щелчком мыши. Я хочу напечатать каждое значение, соответствующее каждой строке, для каждой кнопки редактирования, которую я нажимаю на эту строку

Ответ №1:

Я изменил идентификатор onclick на class, а затем использовал attr вместо data, и это сработало. Пожалуйста, проверьте мое решение ниже:

   $(document).on( "click", '.updatesection', function(e) {

  var data = $(this).attr('data-id');
   alert(data);
  });