Primefaces - how to display dataGrid and select menu inline
It may sound a silly question but I've tried everything: with style attribute (display: inline), with styleClass attribute but nothing. I want this code to be displayed on the same line/row:
<p:panel rendered="#{not empty enastrSearch.recordsList}">
<p:dataTable id="tableData" var="record" value="#{enastrSearch.recordsList}" style="border: 0px" >
<p:column>
<p:dataGrid var="column" 开发者_开发问答value="#{record.renderColumnList}" columns="4" style="display: inline">
<p:column>
#{column.columnValue}
</p:column>
</p:dataGrid>
<h:selectOneMenu value="#{options.selectedBank}" style="display: inline" >
<f:selectItems value="#{banks.currentBanks}" />
</h:selectOneMenu>
</p:column>
</p:dataTable>
</p:panel>
Thank you!
Either add the following to your CSS:
#tableData .ui-datagrid {
float: left;
}
Or if that doesn't achieve the desired layout (the items will collapse together without whitespace, you'd need to manipulate the whitespace yourself inside the datagrid's column content), then put them in a <h:panelGrid columns="2">
instead:
<h:panelGrid columns="2">
<p:dataGrid ... />
<h:selectOneMenu ... />
</h:panelGrid>
精彩评论