Как создать FlexTable с thead и tbody
Как создать эту простейшую таблицу в GWT FlexTable?
<table>
<thead>
<tr>
<th>Month</th>
<th>Savings</th>
</tr>
</thead>
<tbody>
<tr>
<td>January</td>
<td>$100</td>
</tr>
<tr>
<td>February</td>
<td>$80</td>
</tr>
</tbody>
</table>
В документации FlexTable не совсем понятно, как создавать таблицы с thead
а также tbody
, Кто-нибудь может помочь? Заранее спасибо.
2 ответа
Решение
Если вы хотите сохранить гибкость FlexTable
и нужно добавить thead
элемент, вы можете достичь этого, манипулируя TableElement
, Это довольно низкий уровень, но id делает то, что вам нужно.
Вот как получить структуру DOM в вашем примере:
FlexTable table = new FlexTable();
table.setText(0, 0, "January");
table.setText(0, 1, "$100");
table.setText(1, 0, "February");
table.setText(1, 1, "$80");
com.google.gwt.user.client.Element oldElement = table.getElement();
com.google.gwt.dom.client.Element element = (com.google.gwt.dom.client.Element) oldElement;
TableElement tableElement = (TableElement) element;
TableSectionElement tHead = tableElement.createTHead();
TableRowElement row = tHead.insertRow(0);
row.insertCell(0).setInnerText("Month");
row.insertCell(1).setInnerText("Savings");
RootPanel.get().add(table);
Обратите внимание, что table.getElement();
возвраты устарели com.google.gwt.user.client.Element
, Расширяется com.google.gwt.dom.client.Element
и так же TableElement
, После того, как все приведения сделаны, вы можете добавить строки и ячейки thead
,
Вот результат (протестирован с GWT 2.7 на Chrome):