Почему я не могу передать переменную post в PHP, когда я покрываю .ajax функцией?

#javascript #html #jquery #ajax

#javascript #HTML #jquery #ajax

Вопрос:

У меня есть 3 файла для отображения данных из myAdmin, и он не показывает ошибок, но после того, как я поместил функцию вокруг .ajax, чтобы повторно использовать ее, я не могу передать идентификатор кнопки в PHP. «Неопределенный индекс: btnId», Что кажется неправильным?

HTML-файл, написанный на PHP (ниже приведен цикл для кода)

    print"<button class='refresh' data-name='$btnId' id='$btnId'>{$btnId}</button>";  
   print "<table id='$idForShowNewData' class='showNewData'></table>"; 
  

show.js

 $(document).ready(function(){
  $('.refresh').click(function(){

    $(function showTable() {
    $.ajax({
          url: "show.php",
          type: "POST",
          data: {
            "btnId": $(this).data("name")
          },
          success: function(data) {
             //more code
          },
          error: function(xhr,XMLHttpRequest,errorThrown){
             //more code
          }
        });
      });
    showTable();

  });
});
  

PHP-файл, который получает данные от myAdmin. Получение идентификатора, подобного приведенному ниже, находится в верхней части скрипта.

 $gotBtnId = $_POST['btnId'];
  

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

1. Почему вы «обернули» function showTable() { ... } в $( ) ? $( <function> ) это краткая форма $(document).ready( <function> )

2. Почему это обернуто в дополнительную функцию внутри обработчика кликов, почему вы не выполняете код непосредственно там?

3. Я хочу использовать часть .ajax несколько раз.

Ответ №1:

this in showTable относится к window объекту, а не к тому, button чей data-name запрос вы хотите отправить.

Если вы хотите, showTable чтобы она вызывалась при загрузке страницы, а также была зарегистрирована в качестве прослушивателя событий нажатия кнопки обновления, объявите это следующим образом:

    const $refreshBtn = $('button.refresh');
   function showTable() {
      
    $.ajax({
          url: "show.php",
          type: "POST",
          data: {
            "btnId": $refreshBtn.data("name")
          },
          success: function(data) {
             //more code
          },
          error: function(xhr,XMLHttpRequest,errorThrown){
             //more code
          }
        });
      });

   $(function() {
      showTable();
      $refreshBtn.click(showTable); 
   });