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

Posted

技术标签:

【中文标题】使用 php 保存可编辑表中的值【英文标题】:save values from editable table using php 【发布时间】:2016-06-10 15:33:09 【问题描述】:

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

请推荐

编辑:-

我的代码是

    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>";   

【问题讨论】:

你的代码在哪里? 用户是按记录提交记录还是允许多次编辑? 允许多次编辑,甚至可以通过单击一次按钮保存所有值(多行)。请建议 我已准备好根据我得到的分析和反馈来改变它的方式.. 如果你想保存整个表格,那为什么每一行都有更新按钮? 【参考方案1】:

让我给你最好的方法 首先,您的数据库表有空格:更正例如

$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";

?>

【讨论】:

@trincot 我真的不知道 mysqli 和 PDO 的事情。请您在 php 部分编辑我的代码吗?关于 mysqli 和 PDO,我看到了在那里使用的正确代码。我也在学习 @trincot 现在我已将其更新为符合 PDO 我把我的反对票变成了赞成票,但你仍然有mysql_real_escape_string。您应该改用 PDO prepare。【参考方案2】:

要保存整个表格,您可以不使用行级更新按钮,而只有一个保存按钮:

<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 应该只回显一条消息:确认(“表已成功保存”)或错误消息(“出现问题。您的数据未保存。” )。

它不应该重现表格的 HTML,因为它已经显示在浏览器中。 JavaScript 代码将使用任何 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();

【讨论】:

savetable.php 现在的样子 这看起来很危险吗?您删除所有内容然后再次插入。或者这就是 PDO 的工作方式 我在我的代码中解释说,只有在一切正常的情况下才能进行任何更改。所以要么全有,要么全无。这就是为什么有一个交易被打开。因此,如果 INSERT 失败,DELETE 的效果将通过调用回滚自动恢复。这不是特定于 PDO,而是特定于 SQL 数据库。这样您就不需要单独的 DELETE、UPDATE 和 INSERT 代码来模拟网页中的行删除、插入和更新。【参考方案3】:

您可以做的是对 php 进行 ajax 调用,其中包含您要保存的行的 id 和新数据。然后使用 PDO 连接数据库并更新信息。完成后,使用 javascript 编辑表格本身。

因此,您需要做的是查找如何使用 ajax 调用和使用 PDO。我建议您在回显表格本身时 &lt;button href = '#' onclick="updateRow('. $row['Row Number'] .')"&gt;Update&lt;/a&gt;&lt;/td&gt; 其中 Row Number 是数据库中的 ID,updateRow() 是您将创建的用于获取新信息并通过 ajax 发送的 javascript 函数。不要使用 mysql_*,因为 php 7 不支持它,它很快就会死掉。改为查找 PDO。

【讨论】:

以上是关于使用 php 保存可编辑表中的值的主要内容,如果未能解决你的问题,请参考以下文章

使用 PHP 将值插入到可编辑的 PDF 中,并使其保持可编辑状态

R Shiny DT - 使用反应式编辑表中的值

FuncUtility.php文件-(操作可编辑数据集中的值)

单击时 - 使 @Html.DisplayFor 成为可编辑的文本字段

在 PHP Laravel 5.x 中编辑后如何保存以前的 MySQL 字段条目?

php 保存编辑器内容中的远程图片为本地图片