I have three drop down list <h:selectOneMenu>
, and a <p:dataTable>
. I want the three drop down list to be side by side with the dataTable. As I have right now, The three drop down lists are above the dataTable. I try to create bigger table and put the three drop down lists in one column, and put <h:dataTable>
in another column to get the side by side layout, but it does not work. Here is what I got so far
<h:selectOneMenu id="customer" value="#{DMBackingBean.customer}">
<f:selectItem itemLabel="Select Customer" itemValue="" />
<f:selectItems value="#{DMBackingBean.customers}"/>
<p:ajax actionListener="#{DMBackingBean.handCustomerChange}" update="facility" event="change"/>
</h:selectOneMenu>
<br/><br/>
<h:selectOneMenu id="facility" value="#{DMBackingBean.facility}">
<f:selectItem itemLabel="Select Facility" itemValue=""/>
<f:selectItems value="#{DMBackingBean.facilities}"/>
</h:selectOneMenu>
<br/><br/>
<h:selectOneMenu id="project" value="#{DMBackingBean.project}">
<f:selectItem itemLabel="Select Projet" itemValue=""/>
<f:selectItems value="#{DMBackingBean.projects}"/>
</h:selectOneMenu>
<p:dataTable var="item" value="#{DMBackingBean.drawings}" selection="#{DMBackingBean.selectedDrawing}" selectionMode="single">
<p:column>
<f:facet name="header">
<h:outputText value="DrawingType"/>
</f:facet>
<h:outputText value="#{item.drawingType}"/>
</p:column>
...
</p:dataTable>