GWT - 使用UIField HTML创建动态表

时间:2018-06-17 18:23:28

标签: java html gwt uibinder gwt-rpc

我正在尝试建立一个MVP GWT APP。 在我的视图中,我想创建一个动态HTML表,它使用@UiField HTML填充来自ArrayList的数据。 现在我可以在eclipse中编译我的应用程序而没有错误,但我无法在浏览器中看到我的数据。我在浏览器中看到的错误是:

Error code from the Browser

类ActionServiceImpl中服务器端的代码如下所示:

public class ActionServiceImpl extends RemoteServiceServlet implements MyActionService {

    private static final String[] actionName = new String[] { "Trikots für A-Jugend", "Rollstuhl für Maria" };
    private static final double[] targetAmount = new double[] { 1000, 2500 };
    private static final double[] donationMinimum = new double[] { 10, 10 };
    private static final double[] amountDonationSoFar = new double[] { 258, 742 };
    private static final String[] accountName = new String[] { "Max Mustermann", "Maria Musterfrau" };
    private static final String[] iban = new String[] { "DE447818032764520919100", "DE4478180328485419100" };    
    private static final String[] NameOfBank = new String[] { "ABC Bank", "XYZ Bank" };    
    private final HashMap<String, Campaign> actions = new HashMap<String, Campaign>();
    private final HashMap<String, Account> accounts = new HashMap<String, Account>();

    public ActionServiceImpl() {
        initActions();
    }

    private void initActions() {

        for (int i = 0; i < actionName.length; ++i) {
            Account account = new Account(accountName[i], NameOfBank[i], iban[i]);
            Campaign action = new Campaign(String.valueOf(i), actionName[i], targetAmount[i], donationMinimum[i],
                    amountDonationSoFar[i], account);
            accounts.put(account.getName(), account);
            actions.put(action.getId(), action);
        }
    }


@Override
    public ArrayList<ShowActions> getShowActions() {
        ArrayList<ShowActions> showActions = new ArrayList<ShowActions>();

        Iterator<String> it = actions.keySet().iterator();
        while (it.hasNext()) {
            Campaign action = actions.get(it.next());
            showActions.add(action.getActions());
        }
        return showActions;
    }

MyActionService接口如下所示:

@RemoteServiceRelativePath("myActionService")
public interface MyActionService extends RemoteService {
    ShowActions addAction(Campaign action);
    Campaign getCampaign(String id);
    ArrayList<ShowActions> getShowActions();

    Campaign updateAction(Campaign action);
}

我的视图“ShowActionViewImpl”中的相应源代码是:

... @UiField HTML actionTable; ...

public void setRowData(ArrayList<T> rowData) {
            this.rowData = rowData;
        TableElement table = Document.get().createTableElement();
        TableSectionElement tbody;
        table.appendChild(tbody = Document.get().createTBodyElement()); 
        for(int i = 0;i<rowData.size(); ++i) 
        {
            TableRowElement row = tbody.insertRow(-1); 
            T t = rowData.get(i); 
            for (int j = 0; j < columnDefinitions.size(); ++j) {
                TableCellElement cell = row.insertCell(-1);
                StringBuilder sb = new StringBuilder();
                columnDefinitions.get(j).render(t, sb);
                cell.setInnerHTML(sb.toString());
            Element child = cell.getFirstChildElement();
                if (child != null) {
                    Event.sinkEvents(child, Event.ONFOCUS | Event.ONBLUR);
                }
            }
        }
        actionTable.setHTML(table.getInnerHTML());
    }

相应的ui.xml看起来像这样:

<ui:UiBinder 
  xmlns:ui="urn:ui:com.google.gwt.uibinder"
  xmlns:g="urn:import:com.google.gwt.user.client.ui">

    <ui:style>
        .contactsViewButtonHPanel {
         margin: 5px 0px 0x 5px;    
        }
      .contactsViewContactsFlexTable {
       margin: 5px 0px 5px 0px; 
      }
    </ui:style>

  <g:DecoratorPanel>
      <g:VerticalPanel>
        <g:HorizontalPanel addStyleNames="{style.contactsViewButtonHPanel}">
          <g:Button ui:field="addButton">Add</g:Button>
          <g:Button ui:field="removeButton">Delete</g:Button>
          <g:Button ui:field="editButton">Add</g:Button>
          <g:Button ui:field="donationListButton">Delete</g:Button>
           <g:Button ui:field="formButton">Delete</g:Button>
        </g:HorizontalPanel>
        <g:HTML ui:field="actionTable"></g:HTML>
        <!--<g:FlexTable ui:field="contactsTable" addStyleNames="{style.contactsViewContactsFlexTable}"/>  -->
      </g:VerticalPanel>
  </g:DecoratorPanel>
</ui:UiBinder>

有没有人知道如何解决我的问题?或者还有其他方式可以显示我的数据吗?

提前谢谢!

0 个答案:

没有答案