Will
Will

Reputation: 410

GWT RootPanel get by ID

I am new to GWT and I am probably overlooking something simple. So what I am trying to do is in my html page I have created a layout for my page in the body tags:

<table id="wrapper" cellpadding="0" cellspacing="0" style="width: 100%;height: 100%;">

         <!-- Header row -->
         <tr style="height: 25%;">
             <td colspan="2" id="header"></td>
         </tr>

         <!-- Body row and left nav row -->
         <tr style="height: 65%;">
             <td id="leftnav"></td>
             <td id="content"></td>
         </tr>

         <!-- Footer row -->
         <tr style="height: 10%;">
            <td colspan="2" id="footer"></td>
         </tr>

</table

I have set Ids to everything so that I can get these items in the Entry point. So in my Entry point I try to populate these fields like this:

RootPanel.get("header").add(new Header());
RootPanel.get("leftnav").add(new NavigationMenu());
RootPanel.get("footer").add(new Footer());

However I have learned through debugging that the RootPanel.get("header") is returning null. I am sure the rest are returning null as well, it is just crashing before it gets there. To my understanding this is the right way to do things, however I must have missed something. Please let me know what I am doing wrong or if you need more info. Thanks

Upvotes: 2

Views: 2940

Answers (2)

enrybo
enrybo

Reputation: 1785

Usually using div tags will work better than other types of elements such as <td>. Like the comments say, you should try to just use one RootPanel and then add then create your layout with GWT panels.

A very good way to layout a page like an HTML page is by using UiBinder. You can write out the layout using and XML language very close to HTML and at the same time use all of the useful GWT widgets. It's very useful to use and learn if you'll be building apps with GWT.

Upvotes: 1

Donato Szilagyi
Donato Szilagyi

Reputation: 4369

Try to use div tags in HTML:

<table id="wrapper" cellpadding="0" cellspacing="0" style="width: 100%;height: 100%;">

         <!-- Header row -->
         <tr style="height: 25%;">
             <td colspan="2"><div id="header"></div></td>
         </tr>

         <!-- Body row and left nav row -->
         <tr style="height: 65%;">
             <td><div id="leftnav"></div></td>
             <td><div id="content"></div></td>
         </tr>

         <!-- Footer row -->
         <tr style="height: 10%;">
            <td colspan="2"><div id="footer"></div></td>
         </tr>

</table

Upvotes: 1

Related Questions