D
dphizler
Hello,
(I tried to find a html google group but couldn't find and this is
also in relation to javascript/ajax)
Basically I have a html table with a bunch of data from a database
(MySQL).
I would like to be able to press on a link and have the a given table
row slide down to expand into the editing zone.
I would use Ajax to populate that editing space with the detail data
from the database.
So this would be my table:
<table>
<tr>
<th>ID</th>
<th>Name</th>
<th>Value</th>
<th>Edit</th>
<tr>
<tr>
<td>1</td>
<td>House</td>
<td>5000</td>
<td><a href="">Edit</a></td>
</tr>
<tr>
<td>2</td>
<td>Dog</td>
<td>2000</td>
<td><a href="">Edit</a></td>
</tr>
<tr>
<td>3</td>
<td>Cat</td>
<td>1000</td>
<td><a href="">Edit</a></td>
</tr>
</table>
If I wanted to change an entire row of my table using Ajax, I can't
just put a div around the tr tag because that just doesn't work. I
need to but a div around all my td tags. I really just want a normal
for to appear in the table row without the row separations, a bit in
this style:
<table>
<tr>
<th>ID</th>
<th>Name</th>
<th>Value</th>
<th>Edit</th>
<tr>
<tr>
<td colspan="4">
<div id="row_1">
<form method="post" action="" >
<input type="hidden" name="ID" value="1">
<table>
<tr>
<td>Name</td>
<td><input type="text" name="Name" value="House" /></td>
</tr>
<tr>
<td>Value</td>
<td><input type="text" name="Value" value="5000" /></td>
</tr>
<tr>
<td colspan="2"><input type="submit" name="submit" id="submit"
value="Apply" /></td>
</tr>
</table>
</form>
<div>
<tr>
<td><div id="row_2_id">2</div></td>
<td><div id="row_2_name">Dog</div></td>
<td><div id="row_2_value">2000</div></td>
<td><div id="row_2_edit"><a href="">Edit</a></div></td>
</tr>
<tr>
<td><div id="row_3_id">3</div></td>
<td><div id="row_3_name">Cat</div></td>
<td><div id="row_3_value">1000</div></td>
<td><div id="row_3_edit"><a href="">Edit</a></div></td>
</tr>
</table>
I already have an idea about how to do the whole sliding thing. But
I'm having difficulty with is the whole replacing an entire row of a
table using ajax. Anybody have an idea of what to do, where to place
the divs to take care of that whole business.
Thanks for your input.
Phil
(I tried to find a html google group but couldn't find and this is
also in relation to javascript/ajax)
Basically I have a html table with a bunch of data from a database
(MySQL).
I would like to be able to press on a link and have the a given table
row slide down to expand into the editing zone.
I would use Ajax to populate that editing space with the detail data
from the database.
So this would be my table:
<table>
<tr>
<th>ID</th>
<th>Name</th>
<th>Value</th>
<th>Edit</th>
<tr>
<tr>
<td>1</td>
<td>House</td>
<td>5000</td>
<td><a href="">Edit</a></td>
</tr>
<tr>
<td>2</td>
<td>Dog</td>
<td>2000</td>
<td><a href="">Edit</a></td>
</tr>
<tr>
<td>3</td>
<td>Cat</td>
<td>1000</td>
<td><a href="">Edit</a></td>
</tr>
</table>
If I wanted to change an entire row of my table using Ajax, I can't
just put a div around the tr tag because that just doesn't work. I
need to but a div around all my td tags. I really just want a normal
for to appear in the table row without the row separations, a bit in
this style:
<table>
<tr>
<th>ID</th>
<th>Name</th>
<th>Value</th>
<th>Edit</th>
<tr>
<tr>
<td colspan="4">
<div id="row_1">
<form method="post" action="" >
<input type="hidden" name="ID" value="1">
<table>
<tr>
<td>Name</td>
<td><input type="text" name="Name" value="House" /></td>
</tr>
<tr>
<td>Value</td>
<td><input type="text" name="Value" value="5000" /></td>
</tr>
<tr>
<td colspan="2"><input type="submit" name="submit" id="submit"
value="Apply" /></td>
</tr>
</table>
</form>
<div>
<tr>
<td><div id="row_2_id">2</div></td>
<td><div id="row_2_name">Dog</div></td>
<td><div id="row_2_value">2000</div></td>
<td><div id="row_2_edit"><a href="">Edit</a></div></td>
</tr>
<tr>
<td><div id="row_3_id">3</div></td>
<td><div id="row_3_name">Cat</div></td>
<td><div id="row_3_value">1000</div></td>
<td><div id="row_3_edit"><a href="">Edit</a></div></td>
</tr>
</table>
I already have an idea about how to do the whole sliding thing. But
I'm having difficulty with is the whole replacing an entire row of a
table using ajax. Anybody have an idea of what to do, where to place
the divs to take care of that whole business.
Thanks for your input.
Phil