-
Book Overview & Buying
-
Table Of Contents
jQuery 1.3 with PHP
By :
Another useful design pattern that is easy to implement is to allow the user to click a piece of text, have it converted to a text input box, and save its updated value on the server.
This is very useful when you have a table of information and want to edit one field in one of the rows. Instead of loading a whole new page to just edit that row, you can edit the data inline and have it saved by the server. This is demonstrated in the following screenshot:

For this example, I've created a table of names and email addresses, to be saved in a new directory, /2-inline_editing, as the inline-editing.html file. Create a standard HTML page, including the <html>, <head>, and <body> elements. I've provided a sample row below, and you should add a few more yourself.
<table>
...
<tr>
<td>Bob Burry</td>
<td>[email protected]</td>
<td><a href="edit.php?id=6">edit</a></td>
<...
Change the font size
Change margin width
Change background colour