Business Console 10.7 | webMethods Business Console Documentation | Developing Gadgets for Business Console | Getting Started | Using RESTful Services with Gadgets | Adding User Interface Code to XHTML
 
Adding User Interface Code to XHTML
*To display information in a table
1. Use HTML table tag to create a table.
2. Add the HTML below to the gadget's view.xhtml file.
<table class="table table-bordered">
<thead>
<tr>
<th>Host</th>
<th>Port</th>
<th>Uptime (sec)</th>
<th>Free/Max Memory(MB)</th>
</tr>
</thead>
<tr>

<td>{{restData.host}}</td>
<td>{{restData.httpPort}}</td>
<td>{{restData.uptime}}</td>
<td>
{{Math.round(restData.freeMemory/1000000)}}/{{Math.round(restData.
maxMemory/1000000)}}
</td>
</tr>
</table>
Note:table, table-bordered from bootstrap enhances the look and feel of the table. You can add more styles to the gadget.scss if required.
The restData object that was associated with $scope object is directly accessible in the user interface. If restData is an Array, you can iterate restData by using an data-ng-repeat tag of AngularJS to populate multiple rows of the table.