将值从 html 表保存到数据库答案

【问题标题】：save values from html table to database将值从 html 表保存到数据库
【发布时间】：2011-12-30 10:41:34
【问题描述】：

我有一个显示数据库值的 html 表。我有一个 javascript，可以让我编辑这些数据，但是我不知道如何使用 php 将它保存回数据库。我发现了一些我应该使用 xmlhttprequests 的信息，但我不知道如何做到这一点。有什么建议？非常感谢您的帮助。代码如下；

    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    <title>Untitled Document</title>
    <script type="text/javascript"><!--

    function edit_input(obj) {
    var is_checked = obj.checked;
    while (obj.tagName!='TR')
    obj = obj.parentNode;

    var td = obj.getElementsByTagName('TD');
    var len = td.length;

    if (!is_checked) {

    for (var i=0; i<len; i++)
    if (td[i].className=='editable')
    td[i].innerHTML = td[i].firstChild.value;


    } else {

    var input;

    for (var i=0; i<len; i++)
    if (td[i].className=='editable') {
    input = document.createElement('INPUT');
    input.value = td[i].innerHTML;
    td[i].innerHTML = '';
    td[i].appendChild(input);
    }
    }

    }


    --></script>


    </head>

    <body>
    <table border="1">
    <tr>
         <th width="56">Branch ID</th>
    <th width="75">Branch Name</th>
         <th width="75">Branch Personnel</th>                            
         <th width="105">Branch Headquaters</th>
    <th width="50">Edit</th>
    </tr>
<?php

$result = mysql_query($query );
    while ($row= mysql_fetch_array($result)) { ?>
         <tr>
             <td class="editable"><?php echo $row['branchid'];?></td>
             <td class="editable"><?php echo $row['branchname'];?></td>     
             <td class="editable"><?php echo $row['branchpersonnel'];?></td>
             <td class="editable"><?php echo $row['branchhq'];?></td>   
        <td><input type="checkbox" onclick="edit_inpu(this);">Edit</td>  
         </tr>                                          
<?php } ?>
    <tr><td><input type="submit" name="editbranch" class="button2"       value="Update"/></td></tr> 
</table>    
    </body>
    </html>

【问题讨论】：

你需要学习AJAX见w3schools.com/php/php_ajax_intro.asp
w3fools.com ... 看过 w3schools 后也许可以看看那里
@RupeshPawar - 你应该避免推荐 w3schools。它有一些严重的问题。
Mozilla 开发者网络 (MDN) 上的 AJAX：developer.mozilla.org/en/AJAX
@AaronLee 你刚刚睁开了我的眼睛。谢谢！

标签： php javascript html

【解决方案1】：

如果使用 jQuery 没有问题，也许使用 JEditable 之类的东西是一个解决方案。当您单击表格中的单元格时，它会变成一个文本字段，当您按下回车键或离开焦点时，它会向服务器发出 Web 请求，您可以在其中进行更改。

参见例如this jsfiddle 脚本。它真的很容易使用。您唯一需要做的另一件事是为表格单元格提供一个 ID，该 ID 也会发送到您要保存它的页面。

【讨论】：

嗨，Ikke，谢谢，但就像使用 jquery 一样简单，我以前没有使用过它。我知道我应该学习它，我会，但我现在不能应用它。还有其他想法吗？
学习 jQuery 比学习 javascript 和 XHR 更容易。该组件为您处理所有工作。

【解决方案2】：

让您的脚本通过 XMLHttpRequest 向 PHP 脚本发出 Ajax 请求，将值保存回数据库。

网址可能是这样的：updatetable.php?row=0&col=0&data=1234

【讨论】：

我想了解你，但不知何故迷路了。所以我应该有一个单独的 php 脚本来进行更新，然后将我的更新按钮寻址为 updatetable.php?row=0&col=0&data=1234 ？这是什么意思？
不，您应该使用 Ajax 来触发对脚本的 HTTP 请求。请参阅我链接的 XMLHttpRequest 文档。
我现在明白了，但能否请您进一步解释一下 url 部分？如何自定义 url 以从表中获取数据并将其发布到 update.php 页面？
您可以将表格数据序列化为 JSON 字符串并作为 POST 参数发送。

【解决方案3】：

你可以用jquery，很流行。

您必须下载 lib 并将其包含在标题中

http://code.jquery.com/jquery-1.7.min.js

这就是你如何在 jquery 中使用 ajax 请求：

http://api.jquery.com/jQuery.ajax/

url 参数是您发送值的位置，以便像帖子一样保存它们。

【讨论】：