PHP / AJAX / Mysql сгенерированные ссылки на таблицы работают неправильно

Question

У меня есть несколько таблиц на нашем сайте, которые создаются путем извлечения данных из базы данных mysql. У меня есть гиперссылки в таблице, на которые пользователь должен иметь возможность нажимать. При нажатии указывается c соответствующие данные ячейки должны быть распознаны и возвращены. Я частично выполнил это с помощью для l oop каждой строки; ОДНАКО последствия этого состоят в том, что пользователю необходимо дважды щелкнуть ссылку, чтобы заставить ее работать И так как строки «активируются», если они нажимают на другую row, команда AJAX запускается и для этой строки. Что требует неэффективных обходных путей, чтобы избежать проблем. Например, если строка / запись содержит ссылку «удалить запись», прикрепленную к команде AJAX => PHP, она удалит любую строку в таблице, если щелкнуть по ней, даже не щелкнув по ссылке.

Таблица обрабатывается с помощью запроса PHP из Mysql со ссылками на каждую строку, которые соответствуют каждой строке.

$mainid=mysqli_real_escape_string($conn,$_POST["mcnum"]);
$useid=mysqli_real_escape_string($conn,$_POST["dlnum"]);

$sql="SELECT id,subname AS name,description AS des,pct,
score
FROM probability LEFT JOIN a_score ON a_score.subid=probability.id
WHERE probability.maincat='$maincatid' AND a_score.oppid='$dealid'";
$result=mysqli_query($connect,$sql);

echo '
<div style="height:160px;overflow:scroll;" id="subpad">
<table style="font-size:12px;" id="strtlist">
<tr>
<th style="border: 1px solid black;position:sticky;top:0;background-color:#A9D0F5;">Save Changes</th>
<th style="border: 1px solid black;position:sticky;top:0;background-color:#A9D0F5;">ID</th>
<th style="border: 1px solid black;position:sticky;top:0;background-color:#A9D0F5;">NAME</th>
<th style="border: 1px solid black;position:sticky;top:0;background-color:#A9D0F5;">Description</th>
<th style="border: 1px solid black;position:sticky;top:0;background-color:#A9D0F5;">Target %</th>
<th style="border: 1px solid black;position:sticky;top:0;background-color:#A9D0F5;">Your Score</th>
</tr>';

while($row = mysqli_fetch_assoc($result)){

    echo "<tr style='background-color:#FFFFFF;'>
    <td style='border: 1px solid black;'><a href='' id='savelnk' name='nmsvlnk' class='linksc'>Save</a><a href='' id='savelnk2'                                 name='nmsvlnk2' class='linksc2' style='color:blue;'>Erase</a></td>

    <td style='border: 1px solid black;'>".$row['id']."</td>
    <td style='border: 1px solid black;'>".$row['name']."</td>
    <td style='border: 1px solid black;'>".$row['des']."</td>
    <td style='border: 1px solid black;'>".$row['pct']."%</td>
    <td style='border: 1px solid black;' contenteditable>".$row['score']."%</td>
    </tr>";

}

echo '</table>';
echo '</div>';

******** ЭТО ДЛЯ Л OOP ФУНКЦИЯ Я ИСПОЛЬЗУЮ *************

$(document).on('click', '#savelnk', function() {
  event.preventDefault();

  for (var i = 0; i < strtlist.length; i++) {
    strtlist.rows[i].onclick = function() {
      rIndex = this.rowIndex;
      var recordid = this.cells[1].innerHTML;
      var nwscore = this.cells[5].innerHTML;
      $.post('includes/updatescore.php', {
        recordid: recordid,
        nwscore: nwscore
      }, function(data) {
        alert(data);
      });
    };
  }
});

Answer 1

Вы не должны добавлять обработчик кликов внутри обработчика кликов. Просто делайте то, что вы хотите в главном обработчике кликов.

Другая проблема заключается в том, что вы повторяете id="savelink" в каждой строке. Идентификаторы должны быть уникальными, вместо этого следует использовать класс.

Так что PHP должно быть:

while($row = mysqli_fetch_assoc($result)){

    echo "<tr style='background-color:#FFFFFF;'>
    <td style='border: 1px solid black;'><a href='' name='nmsvlnk' class='linksc savelnk'>Save</a><a href='' id='savelnk2'                                 name='nmsvlnk2' class='linksc2' style='color:blue;'>Erase</a></td>

    <td style='border: 1px solid black;'>".$row['id']."</td>
    <td style='border: 1px solid black;'>".$row['name']."</td>
    <td style='border: 1px solid black;'>".$row['des']."</td>
    <td style='border: 1px solid black;'>".$row['pct']."%</td>
    <td style='border: 1px solid black;' contenteditable>".$row['score']."%</td>
    </tr>";

}

, а JS должно быть

$("#strtlist").on('click', '.savelnk', function() {
  event.preventDefault();

  var recordid = this.cells[1].innerHTML;
  var nwscore = this.cells[5].innerHTML;
  $.post('includes/updatescore.php', {
    recordid: recordid,
    nwscore: nwscore
  }, function(data) {
    alert(data);
  });
});