Editable table with Ajax and struts 2

[Mansour]

Hello every one:
I am trying to create a table in GWT that adds functionality to an
existing table. This functionality is editing and updating the edited
records through struts 2 Actions. I need someone to point me in the
right direction, just to make sure that I am going right.

I have this html element in my page:

<table id="editable">
<thead>
<tr>
<td> Name </td>
<td> city </td>
<td> postal Code </td>
</tr>
</thead>
<tbody>
<tr>
<td> John </td>
<td> city1 </td>
<td> someCode1 </td>
</tr>
<tr>
<td> Tom </td>
<td> city2 </td>
<td> someCode2 </td>
</tr>
<tr>
<td> Peter </td>
<td> city3 </td>
<td> someCode3 </td>
</tr>
</tbody>
</tabel>

I need a script that will add two extra buttons for (delete/update) actions.
I started to write the java code that will generate the JS for this. The
code will take the above html from the page and add to it the buttons.
However, I am stuck in puting the above html in an object to process it,
and to replace it on the HTML page with the new code.

String oldTable = RootPanel.get("editable").getElement().toString();
FlexTable newTable = new FlexTable();

I will add the cells I need to the newTable and replace the old one. Am
I doing anything right here ? is there a better idea ?

[Mansour]

I can understand now why GWT has a small community.

[Mansour]

Ok, I think I am not moving forward at all.
I have this html table:

<table id="editable">
<thead>
<tr>

<td> id </td>
<td> Fruit </td>
</tr>
</thead>
<tbody>
<tr>
<td> 1 </td>
<td> apple </td>
</tr>
<tr>
<td> 2 </td>
<td> banana </td>
</tr>
<tr>
<td> 3 </td>
<td> orange </td>
</tr>
</tbody>
</tabel>

All I need is to add few cells for this table. Ineed to remove it, then
manuplate the DOM. Then add it again. I am doing this:

public DynamicTable( String ID ) {
Element oldFrame = RootPanel.get(ID).getElement();
DOM.removeChild(RootPanel.getBodyElement(), oldFrame );

setElement(oldFrame);

this.setBorderWidth(3);

this.removeRow( 0); //here' there' and exception !
}

the last line is throwing an exception. Any advice ?

[Matias Rodriguez]

Try not to do DOM manipulation unless it is really necessary. For what
you need to do I think that FlexTable is enough.

http://code.google.com/webtoolkit/documentation/com.google.gwt.user.client.ui.FlexTable.html

[Mansour]

Matias Rodriguez wrote:
> Try not to do DOM manipulation unless it is really necessary.

What other option do I have ? How can I get the existing html into an
object ?

[Matias Rodriguez]

Hi, I really don't know if GWT can help you here :(

If you would like to add a row for example I would try something using
HTMLPanel:

String tableTemplate = "<table id='editable'></table>";
HTMLPanel htmlPanel = new HTMLPanel( tableTemplate );

String rowTemplate = "<tr><td id="cell"></td></tr>"

//To add a new row
HTMLPanel newrow = new HTMLPanel( rowTemplate );
newRow.add( "cell", new SomGwtWidget() );
htmlPanel.add( "editable", newrow );

I haven't actually tried this... but all this looks to ugly for me.

Regards