將選定行添加到另一個表的按鈕

Question

我已經修復了我以前的問題，即將數據從1個表添加到另一個表。現在我有一個問題，當點擊行末尾的按鈕時，它會插入該表的最後一行而不是所選的行。如何修復我的代碼，以便將按鈕按下的行插入新表而不是最後一行？什麼現在

AA11AAA BMW 320I [ADD] 
BB11BBB BMW 325I [ADD] 
CC11CCC BMW 330I [ADD] 

確實

如表，如果我是在第一行（AA11AAA BMW 320I）點擊按鈕，將最後一行添加到新表

CC11CCC BMW 330I 

我希望它補充說，按鈕被點擊的行，所以如果點擊第一行按鈕將其添加的第一行到新表

AA11AAA BMW 320I 

我希望這是明確的，這是我的代碼。

<tr> 
    <input type="hidden" name="regNo" value="<?php echo $row['regNo'] ?>"> 
    <input type="hidden" name="carMake" value="<?php echo $row['carMake'] ?>"> 
    <input type="hidden" name="carModel" value="<?php echo $row['carModel'] ?>"> 
    <td><?php echo $row["regNo"] ?></td> 
    <td><?php echo $row["carMake"] ?></td> 
    <td><?php echo $row["carModel"] ?></td> 
    <td><button onclick="addRowToTable()">ADD</button></td> 
</tr> 

腳本

function addRowToTable() { 
var table = document.getElementById("newCarTable"); 
var row = table.insertRow(0); 
var cell1 = row.insertCell(0); 
var cell2 = row.insertCell(1); 
var cell3 = row.insertCell(2); 
cell1.innerHTML = "<?php echo $row["regNo"] ?>"; 
cell2.innerHTML = "<?php echo $row["carMake"] ?>"; 
cell3.innerHTML = "<?php echo $row["carModel"] ?>"; 
} 

php腳本

<?php 
$sql = "SELECT regNo, carMake, carModel 
     FROM vehicles"; 
$result = mysqli_query($connection, $sql); 
    if (mysqli_num_rows($result) > 0) 
     { 
while($row = mysqli_fetch_assoc($result)) 
{ 
?> 

我如何TR的一個看起來像在網頁源

<tr> 
    <input type="hidden" name="regNo" value="AA11AAA"> 
    <input type="hidden" name="carMake" value="BMW"> 
    <input type="hidden" name="carModel" value="320I"> 
    <td>AA11AAA</td> 
    <td>BMW</td> 
    <td>320I</td> 
    <td><button onclick="addRowToTable(AA11AAA,BMW,320I)">ADD</button></td> 
</tr> 

我現在想添加新表記錄到我的數據庫

 <table id="newCarTable"> 
     <form action = "addNewCarTable.php" method = "post"> 
     <input id="submit" type="submit" name="submit" value="Submit"> 
     </form> 
    </table> 

addNewCarTable.php

if (isset($_POST['submit'])){ 
$curRegNo = $_POST['regNo']; 
$curCarMake = $_POST['carMake']; 
$curCarModel = $_POST['carModel']; 

$_SESSION["regNo"] = $curRegNo; 
$_SESSION["carMake"] = $curCarMake; 
$_SESSION["carModel"] = $curCarModel; 

$sql = "INSERT INTO newCars(regNo, carMake, carModel) 
     VALUES('$curRegNo', '$curCarMake', '$curCarModel')"; 

Answer 1

首先，這是一個不好的做法，混合JavaScript和PHP這樣的。 （https://softwareengineering.stackexchange.com/questions/126671/is-it-considered-bad-practice-to-have-php-in-your-javascript）

你的問題是你在JavaScript中使用PHP錯誤。 PHP呈現你的DOM（包括JavaScript），然後JavaScript被執行。因此，函數中的數字將是靜態的，而不是動態的。 你最終腳本將呈現這樣的：

function addRowToTable() { 
    var table = document.getElementById("newCarTable"); 
    var row = table.insertRow(0); 
    var cell1 = row.insertCell(0); 
    var cell2 = row.insertCell(1); 
    var cell3 = row.insertCell(2); 
    cell1.innerHTML = "CC11CCC "; 
    cell2.innerHTML = "BMW "; 
    cell3.innerHTML = "330I "; 
} 

通過你的腳本被執行的時候，這個數字已經硬編碼。您可以通過在瀏覽器中查看網站的源代碼來對此進行變更。

你需要做的是從DOM中取出數字，而不是使用PHP。 我不知道你的PHP腳本，但這樣的事情能夠工作：

<?php 
$sql = "SELECT regNo, carMake, carModel 
     FROM vehicles"; 
$result = mysqli_query($connection, $sql); 
    if (mysqli_num_rows($result) > 0) 
     { 
while($row = mysqli_fetch_assoc($result)) 
{ 
    $curRegNo = $row["regNo"]; 
    $curCarMake = $row["carMake"]; 
    $curCarModel = $row["carModel"]; 
?> 

你的錶行：

<tr> 
    <input type="hidden" name="regNo" value="<?php echo $row['regNo'] ?>"> 
    <input type="hidden" name="carMake" value="<?php echo $row['carMake'] ?>"> 
    <input type="hidden" name="carModel" value="<?php echo $row['carModel'] ?>"> 
    <td> 
    <?php echo $row["regNo"] ?> 
    </td> 
    <td> 
    <?php echo $row["carMake"] ?> 
    </td> 
    <td> 
    <?php echo $row["carModel"] ?> 
    </td> 
    <td> 
    <button onclick="addRowToTable('<?php echo $curRegNo ?>','<?php echo $curCarMake ?>','<?php echo $curCarModel ?>')">ADD</button> 
    </td> 
</tr> 

，然後添加參數，你的Javascript功能：

function addRowToTable(regNo, carMake, carModel) { 
    var table = document.getElementById("newCarTable"); 
    var row = table.insertRow(0); 
    var cell1 = row.insertCell(0); 
    var cell2 = row.insertCell(1); 
    var cell3 = row.insertCell(2); 
    cell1.innerHTML = regNo; 
    cell2.innerHTML = carMake; 
    cell3.innerHTML = carModel; 
} 

這是一個可運行的CodePen：http://codepen.io/anon/pen/pgeaOx 它使用硬編碼的數字，因爲我無法渲染模板使用PHP，但它會顯示Javascript是如何工作的。