views:

39

answers:

1

Hi all: I met a problem like this. Here is the scenario: if I have a database table A, which contains several columns, for example. Once the sever (php script) pass the database to web client, it's rendered into a HTML table. Now, here is some requirements for the client side. The user will be able to add/delete several rows from the HTML table, in addition, they will also be able the change the row order. If we could finish the client side with the help from some jquery plugin (for example: http://www.isocra.com/2008/02/table-drag-and-drop-jquery-plugin/). Now, my question is, how could I pass this information back to server? Because there are new rows and deleted rows, the original table row order (like the plugin tableDnD.serialize function is not sufficient) is not enough.

Here is my solution: pass the whole HTML table back to server, and then replace the whole database table with the information. In that case, how to pass a potentially big HTML table back to server? For this question, I found the answer like this: http://stackoverflow.com/questions/1872485/iterate-through-html-table-using-jquery-converting-the-data-in-the-table-into-js Basically,convert the whole HTML table into json format and pass it to server side to replace the whole table.

Is there a better solution than that? Any suggestions would be appreciated! Thanks!

+3  A: 

IMHO, if you are building a JavaScript-only solution, there is no need to pass the whole HTML table back to the server.

  • When loading the table initially, set the id attribute to the unique identifier of the row from the SQL table.
  • When changing data (remove or add a row or change row contents), save the ids into an array.
  • When submitting data once changed, submit only the rows which were changed.

Of course, you may need to tweak this a bit, but it's just a general idea. For example, one tweak to do is to add the ids of removed rows to a separate array. You can then pass it separately to remove the matching rows from the database.

MainMa
when adding a new row in the middle, I have to record its id (no corresponding id in database) in client's side and also the new row's content (no content in database table yet), is that right?
WilliamLou
Since you are on client side, you cannot know what will be the id for the new inserted row in database. So you would rather have empty ids if you want to keep two arrays, or you may create a third array. As for keeping row's content, it is already in your `<td/>` element, so you do not have to keep it separately.
MainMa