Question

我有一个用PHP填充的HTML表格，在第一个单元格中是我的ID，在最后一个单元格中是一个选择框。当用户更改选项时，将使用onchange函数在数据库中对其进行更新。但是有没有办法我可以知道哪个ID连接到所选选择框？因为我想发送该ID并带有指向我的PHP文件的链接.....

这是我的xmlhttp链接：

xmlhttp.open("GET","Update_plaats_ncr.php?q=" + str +"&number=" + num, true);

这是我的桌子：

<?php
if ($result5->num_rows > 0) {
    echo "<table>";
    echo "<tr>";
    echo "<td>";
    echo "NCR number:";
    echo "</td>";
    echo "<td>";
    echo "Status:";
    echo "</td>";
    echo "</tr>";
    while ($row = mysqli_fetch_assoc($result5)) {
        $query6 = "SELECT * FROM `plaats_ncr`";
        $result6 = mysqli_query($connect, $query6);
        $ncrnummer = $row['id'];
        $jsnummer = $row['id'];

        if ($row['id']) {
            echo "<tr>";
            echo "<td>";
            echo "<a href=\"http://ncrapp.petrogas.local/UpdateNCR.php?id=$ncrnummer\">{$ncrnummer}</a>";
            echo "</td>";
            echo "<td>";
            ?>
                <script>
                    function Plaats1(str) {

                        var num = <?php echo $jsnummer ?>;

                        if (str == "") {
                            document.getElementById("txtHint").innerHTML = "";
                            return;
                        }

                        else {
                            if (window.XMLHttpRequest) {
                                xmlhttp = new XMLHttpRequest();
                            }

                            else {
                                xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
                            }

                            xmlhttp.onreadystatechange = function() {
                                if (this.readyState == 4 && this.status == 200) {
                                    document.getElementById("txtHint").innerHTML = this.responseText;
                                }
                            };
                            xmlhttp.open("GET","Update_plaats_ncr.php?q=" + str +"&number=" + num, true);
                            xmlhttp.send();
                        }
                    }
                </script>
                <select name="plaats_ncr" class="form form-control" onchange="Plaats1(this.value)">
                    <?php while ($row = mysqli_fetch_assoc($result6)): ;?>
                        <option value="<?php echo $row['plaats']; ?>"><?php echo $row['plaats']; ?></option>
                    <?php endwhile;?>
                </select>
    <?php
        echo "</td>";
            echo "</tr>";
        }
    }
    echo "</table>";
}
?>

那么我如何在VAR num中放入正确的ID（ncrnumber）？

Answer 1

您可以像这样使用数据API：

<select name="plaats_ncr" class="form form-control" onchange="Plaats1(this)" data-rowId="<?$ncrnummer?>">

并获取ID：

 function Plaats1(elem) {var rowid= elem.getAttribute('data-rowId');}

Answer 2

为了获取id，可以首先获取对select元素的引用，然后转到父tr，然后从那里查找tr的第一个儿子。此td包含textContent属性中的关注值，在本例中为ID。请看这个例子。从那里，您可以构建查询字符串，并将其传递给处理信息的php文件

const selects = document.querySelectorAll('table select');

selects.forEach(select => addEventListener('change', handleChange));

function handleChange(event) {
    const element = event.target;
    const value = element.value;
    const id = getID(element);

    console.log(id, value);
}

function getID(element) {
    return element.closest('tr').children[0].textContent;
}

<table>
  <thead>
      <tr>
          <th>Label 1</th>
          <th>Label 2</th>
          <th>Label 3</th>
          <th>Label 4</th>
          <th>Label 5</th>
          <th>Label 6</th>
          <th>Label 7</th>
          <th>Label 8</th>
          <th>Label 9</th>
      </tr>
  </thead>

  <tbody>
      <tr>
          <td>4931</td>
          <td>lorem6</td>
          <td>lorem6</td>
          <td>lorem6</td>
          <td>lorem6</td>
          <td>lorem6</td>
          <td>lorem6</td>
          <td>lorem6</td>
          <td>
              <select name="option" id="option">
                  <option value="1">Option 1</option>
                  <option value="2">Option 2</option>
                  <option value="3">Option 3</option>
              </select>
          </td>
      </tr>

      <tr>
          <td>4933</td>
          <td>lorem6</td>
          <td>lorem6</td>
          <td>lorem6</td>
          <td>lorem6</td>
          <td>lorem6</td>
          <td>lorem6</td>
          <td>lorem6</td>
          <td>
              <select name="option" id="option">
                  <option value="1">Option 1</option>
                  <option value="2">Option 2</option>
                  <option value="3">Option 3</option>
              </select>
          </td>
      </tr>

      <tr>
          <td>4934</td>
          <td>lorem6</td>
          <td>lorem6</td>
          <td>lorem6</td>
          <td>lorem6</td>
          <td>lorem6</td>
          <td>lorem6</td>
          <td>lorem6</td>
          <td>
              <select name="option" id="option">
                  <option value="1">Option 1</option>
                  <option value="2">Option 2</option>
                  <option value="3">Option 3</option>
              </select>
          </td>
      </tr>

      <tr>
          <td>4943</td>
          <td>lorem6</td>
          <td>lorem6</td>
          <td>lorem6</td>
          <td>lorem6</td>
          <td>lorem6</td>
          <td>lorem6</td>
          <td>lorem6</td>
          <td>
              <select name="option" id="option">
                  <option value="1">Option 1</option>
                  <option value="2">Option 2</option>
                  <option value="3">Option 3</option>
              </select>
          </td>
      </tr>
  </tbody>
</table>

如何从HTML表格获取ID？

2 个答案: