Question

嗨我有一个从php生成的表，它是可编辑的，我想将编辑后的值保存到数据库中。我不知道我怎么能这样做，因为页面上有很多行（动态）。这是一个屏幕截图： - This

请建议

编辑： -

我的代码是

    echo "<table border='1'>
<tr>
<th>Sl Number</th>
<th>Product Id</th>
<th>Product Name</th>
<th>Product Catagory</th>
<th>Retal Price</th>
<th>Max Price</th>
<th>Min Price</th>
<th>Initial Stock</th>
<th>Quantity Sold</th>
<th>Current Stock</th>
<th>Last Order</th>
<th>Edit/Update</th>
</tr>";
while($row = $result->fetch_assoc())
{
        echo "<tr contenteditable>";
    echo "<td>" . $row["Row Number"]. "</td>";
    echo "<td>" . $row["Product Id"]. "</td>";
    echo "<td>" . $row["Product Name"]. "</td>";
    echo "<td>" . $row["Product Catagory"]. "</td>";
    echo "<td>" . $row["Retal Price"]. "</td>";
    echo "<td>" . $row["Max Price"]. "</td>";
    echo "<td>" . $row["Min Price"]."</td>";
    echo "<td>" . $row["Initial Stock"]."</td>";
    echo "<td>" . $row["Quantity Sold"]. "</td>";
    echo "<td>" . $row["Current Stock"]."</td>";
    echo "<td>" . $row["Last Order"]."</td>";
    echo "<td contenteditable = 'false'><button href = '#'>Update</a></td>";
        echo "</tr>";   
}

Answer 1

要保存整个表格，您可以保留行级更新按钮，并只有一个保存按钮：

<button id="save">Save</button>
<div id="msg"></div>

msg 区域用于在执行保存操作时显示来自服务器的反馈。

然后你会添加这个JavaScript来处理点击保存按钮：

$('#save').click(function() {
    var data = []; 
    $('td').each(function() {
        var row = this.parentElement.rowIndex - 1; // excluding heading
        while (row >= data.length) {
            data.push([]);
        }
        data[row].push($(this).text());
    });
    $.post('savetable.php', {table: data}, function (msg) {
        $('#msg').text(msg);
    });
});

这会将没有标题行的HTML表格内容转换为JavaScript矩阵，然后将其发送到 savetable.php 进行处理。

在PHP中，您将使用$_POST['table']来访问该数组。实现这一点时，首先进行调试，然后执行var_dump($_POST['table'])以确保数据传输正确，并且它具有您期望的数组结构。

然后遍历该数组以将行插入数据库。您可以使用mysqli或PDO。

PHP脚本 savetable.php 应仅回显一条消息：确认（＆＃34;表已成功保存＆＃34;）或错误消息（＆＃34;发生问题）。您的数据未保存。＆＃34;）。

它不应该重现表的HTML，因为它已经在浏览器中显示。无论PHP打印将使用哪些PHP代码显示在保存按钮下方。

以下是 savetable.php 的外观。但请仔细调试，我没有测试这段代码。在它运行之前，您首先需要设置数据库模型：

$db = new PDO('mysql:host=localhost;dbname=testdb;charset=utf8mb4', 
              'username', 'password');
// Configure that all database errors result in an exception:
$db->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);

try {
    // Make a transaction: this allows to rollback any of the changes
    // if anything goes wrong before the end of it. 
    $db->beginTransaction();
    // First delete all rows.
    $db->exec("DELETE FROM mytable");
    // Prepare a statement that will be executed for each row.
    // Needs to be extended for all columns:
    $stmt = $db->prepare("INSERT INTO mytable (sl_num, product_id, product_name)
                          VALUES (?, ?, ?)");

    foreach ($_POST('table'] as $row) {
        $stmt->execute($row); // the columns are passed to the prepared statement.
    }
    // All went well: commit the changes.
    $db->commit();
    echo "Table saved successfully";
} catch(PDOException $e) {
    // Something went wrong: roll back any changes made
    $db->rollback();
    echo "An error occurred: " . $e->getMessage();
}

Answer 2

让我给你最好的方式首先，您的数据库表有空格：

从$row["Initial Stock"]到$row["Initial_Stock"]

然后我建议你使用ajax而不是浪费时间点击按钮

HTML页面

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.0.0-beta1/jquery.min.js"></script>
 <script>
$(function(){

    $("#loading").hide();
    //acknowledgement message
    var message_status = $("#status");
    $("td[contenteditable=true]").blur(function(){
        var field_userid = $(this).attr("id") ;
        var value = $(this).text() ;



        $.post('update.php' , field_userid + "=" + value, function(data){



            if(data != '')
            {
                message_status.show();
                message_status.text(data);
                //hide the message
                setTimeout(function(){message_status.hide()},1000);
            }
        });
    });




});
</script>


<style>
table.zebra-style {
    font-family:"Lucida Sans Unicode", "Lucida Grande", Sans-Serif;
    text-align:left;
    border:1px solid #ccc;
    margin-bottom:25px;
    width:100%
}
table.zebra-style th {
    color: #444;
    font-size: 13px;
    font-weight: normal;
    padding: 5px 4px;

}
table.zebra-style td {
    color: #777;
    padding: 4px;
    font-size:13px;

}
table.zebra-style tr.odd {
    background:#f2f2f2;
}


#status { padding:10px; position:fixed; top:10px; border-radius:5px; z-index:10000000; background:#88C4FF; color:#000; font-weight:bold; font-size:12px; margin-bottom:10px; display:none; width:100%; }
#loading { padding:10px; position:absolute; top:10px; border-radius:5px; z-index:10000000; background:#F99; color:#000; font-weight:bold; font-size:12px; margin-bottom:10px; display:none; width:100%; }
</style>

 <div id="status"> </div>
 <div id="loading"></div>





<table id="tableID" border="0"  class="sortable table zebra-style">


<thead>
  <tr>
    <th>Sl Number</th>
    <th>Product Id</th>
    <th>Product Name</th>
    <th>Product Catagory</th>
    <th>Retal Price</th>
    <th>Max Price</th>
    <th>Min Price</th>
    <th>Initial Stock</th>
    <th>Quantity Sold</th>
    <th>Current Stock</th>
    <th>Last Order</th>
    <th>Edit/Update</th>
  </tr>
</thead>
<tbody  class="list">
  <?php do { ?>


  <tr>
    <td contenteditable="true" id="Row_Number:<?php echo $row["Row_Number"]; ?>"><?php echo $row["Row_Number"]; ?></td>
    <td contenteditable="true" id="Product_Id:<?php echo $row["Product_Id"]; ?>"><?php echo $row["Product_Id"]; ?></td>
    <td contenteditable="true" id="Product_Name:<?php echo $row["Product_Name"]; ?>"><?php echo $row["Product_Name"]; ?></td>
    <td contenteditable="true" id="Product_Catagory:<?php echo $row["Product Id"]; ?>"><?php echo $row["Product_Catagory"]; ?></td>
    <td contenteditable="true" id="Retal_Price:<?php echo $row["Retal_Price"]; ?>"><?php echo  $row["Retal_Price"]; ?></td>
    <td contenteditable="true" id="Max_Price:<?php echo $row["Max_Price"]; ?>"><?php echo $row["Max_Price"]; ?></td>
    <td contenteditable="true" id="Min_Price:<?php echo $row["Min_Price"]; ?>"><?php echo  $row["Min_Price"]; ?></td>
    <td contenteditable="true" id="Initial_Stock:<?php echo $row["Initial_Stock"]; ?>"><?php echo  $row["Initial_Stock"]; ?></td>
    <td contenteditable="true" id="Quantity_Sold:<?php echo $row["Quantity_Sold"]; ?>"><?php echo  $row["Quantity_Sold"]; ?></td>
    <td contenteditable="true" id="Last_Order:<?php echo $row["Last_Order"]; ?>"><?php echo  $row["Last_Order"]; ?></td>
    <td contenteditable="true" id="Last_Order:<?php echo $row["Last_Order"]; ?>"><?php echo  $row["Last_Order"]; ?></td>
    <td contenteditable = 'false'></td>";



    </tr>

    <?php } while($row = $result->fetch_assoc()) ?>
 </tbody>
</table>

更新php页面

   <?php  


$db = new PDO('mysql:host=localhost;dbname=testdb;charset=UTF-8', 
                  'username', 
                  'password',
                  array(PDO::ATTR_EMULATE_PREPARES => false,
                  PDO::ATTR_ERRMODE => PDO::ERRMODE_EXCEPTION));


?>

<?php
if(!empty($_POST))
{
    //database settings

    foreach($_POST as $field_name => $val)
    {
        //clean post values
        $field_id = strip_tags(trim($field_name));

        //from the fieldname:user_id we need to get user_id
        $split_data = explode(':', $field_id);
        $product_id = $split_data[1];
        $field_name = $split_data[0];
        if(!empty($product_id) && !empty($field_name) && !empty($val))
        {

            $affected_rows = $db->exec("UPDATE yourtable SET $field_name = '$val' WHERE product_ID = $product_id");
            echo $affected_rows;

            echo "Updated";
        } else {
            echo "Invalid Requests";
        }
    }
} 

else {
    echo "Invalid Requests";
}
?>

Answer 3

你可以做的是ajax调用php，你要保存的行的id和新数据。然后使用PDO连接到数据库并更新信息。完成后，使用javascript编辑表本身。

所以你需要做的是查找如何使用ajax调用并使用PDO。我建议当你回应表本身时 <button href = '#' onclick="updateRow('. $row['Row Number'] .')">Update</a></td>其中，行号是数据库中的ID，updateRow（）是您将创建的javascript函数，用于获取新信息并通过ajax发送。不要使用mysql_ *，因为它在php 7中不受支持，很快就会死掉。查找PDO。

使用php从可编辑表中保存值

3 个答案: