爲什麼我的腳本只能獲取我的php表的第一行？下面是我的代碼

Question

這是我的JavaScript代碼

$('input#name-submit').on('click', function() { 
    var name = $('input#name-submit').val(); 
    if($.trim(name) != ''){ 
     $.post('getmodalreasonUT.php', {name: name}, function(data) { 
      alert(data); 
     }); 
    } 
}); 

，這是我的PHP代碼

<?php 

if(isset($_POST['Pending'])){ 
    echo "<header class='panel-heading'> Undertime Pending</header>"; 
    echo "<table class='table table-bordered'> 
    <thead> 
    <tr class='tbl-record'> 
    <th>ID</th> 
    <th>Name of Employee</th> 
    <th>Position</th> 
    <th>Date Filed</th> 
    <th>Number of hours</th> 
    </tr> 
    </thead> 
    <tbody>"; 

    $sql = "SELECT * FROM utrequestform WHERE user_eid = '$employeenumber' and check_managerandsspv = '0'"; 
    $result = $conn->query($sql); 
    if ($result->num_rows > 0) { 

     while($row = $result->fetch_assoc()){        
      echo "<tr class='tbl-info text-center'>        
      <td>".$row['user_eid']."</td> 
      <td>".$row['nameofemployee']." </td> 
      <td>".$row['position']."</td> 
      <td>".$row['datefiled']."</td> 
      <td>".$row['noofhours']."</td>  
      <td><input type='submit' id='name-submit' value='$row[id]'></td> 
      </tr> "; 

     } 
    }else{ 
     echo "<tr><td colspan='10'>No pending UT request.</td></tr>"; 
    } 
    echo "</tbody></table>"; 
} 
?> 

這是我的回聲PHP代碼。

<?php 
    include ('connection.php'); 
    $please = $_POST['name']; 
    echo $please; 
?> 

Answer 1

您生成HTML這樣的：

<input type='submit' id='name-submit' value='$row[id]'> 

這將多次呈現相同的輸入使用相同的ID。這是無效的標記。您需要更改該行：

<input type='submit' id='name-submit-$row[id]' name='request-val' value='$row[id]'> 

然後改變你的jQuery爲：不惜一切代價已經重複的ID

$('input[name="request-val"]').on('click', function() { 
    var name = $(this).val(); 
    if($.trim(name) != ''){ 
     $.post('getmodalreasonUT.php', {name: name}, function(data) { 
      alert(data); 
     }); 
    } 
}); 

避免。這會讓你在後來的路途中避免很多挫折。