将整个 html 表传回服务器并替换数据库表？答案

【问题标题】：Pass a whole html table back to server and replace the database table?将整个 html 表传回服务器并替换数据库表？
【发布时间】：2011-03-23 11:10:11
【问题描述】：

我遇到了这样的问题。这是场景：例如，如果我有一个数据库表 A，其中包含几列。一旦服务器（PHP 脚本）将数据库传递给 Web 客户端，它就会呈现为 HTML 表。现在，这是客户端的一些要求。用户将能够从 HTML 表中添加/删除几行，此外，他们还能够更改行顺序。如果我们可以在一些 jquery 插件的帮助下完成客户端（例如：http://www.isocra.com/2008/02/table-drag-and-drop-jquery-plugin/）。现在，我的问题是，我怎样才能将这些信息传回服务器？因为有新行和删除行，原来的表行顺序（如插件tableDnD.serialize函数不够用）是不够的。

这是我的解决方案：将整个 HTML 表传回服务器，然后用信息替换整个数据库表。在这种情况下，如何将一个可能很大的 HTML 表传回服务器？对于这个问题，我找到了这样的答案： Iterate through HTML table using jQuery, converting the data in the table into JSON 基本上就是把整个HTML表格转成json格式传到服务器端替换整个表格。

还有比这更好的解决方案吗？任何建议，将不胜感激！

【问题讨论】：

您可以使用 jQuery UI 自己的sortable 对表格行进行排序。可以找到关于如何使表格行可排序的说明here

标签： javascript jquery ajax html-table

【解决方案1】：

恕我直言，如果您正在构建 仅 JavaScript 解决方案，则无需将整个 HTML 表传递回服务器。

最初加载表时，将id 属性设置为SQL 表中行的唯一标识符。
更改数据时（删除或添加行或更改行内容），将 ID 保存到数组中。
提交数据一旦更改，只提交更改的行。

当然，您可能需要稍微调整一下，但这只是一个大致的想法。例如，要做的一项调整是将已删除行的 id 添加到单独的数组中。然后，您可以单独传递它以从数据库中删除匹配的行。

【讨论】：

在中间添加新行时，我必须在客户端记录它的id（数据库中没有对应的id）以及新行的内容（数据库表中还没有内容），是吗对吗？
由于您在客户端，您无法知道数据库中新插入行的 id 是什么。所以如果你想保留两个数组，你宁愿有空的 id，或者你可以创建第三个数组。至于保留row的内容，它已经在你的<td/>元素中了，所以你不必单独保留它。
我一点也不想说粗鲁。但是，如果我是你，我不会将整个 html 表传回服务器。听起来像是通过开发工具或其他东西让自己被黑客入侵的好方法。