jsf - Primefaces separator is displayed as a row element in panelgrid -
how use separator tag in primefaces effectively?
for following output, separator displayed 1 of element in next row. ideally separator in single row , display other input elements. have attached screen shot of how separator displayed, displayed 5th element in second row.
any highly appreciable.
jsf code
<p:panelgrid columns="4" id="mypanel"> <f:facet name="header"> projects </f:facet> <p:outputlabel value="project: "> <p:inputtext required="true" readonly="true"> </p:inputtext> </p:outputlabel> <p:outputlabel value="project title: " > <p:inputtext readonly="true"> </p:inputtext> </p:outputlabel> <p:outputlabel value="is selected " > <p:selectbooleancheckbox value="" /> </p:outputlabel> <p:outputlabel value="is approved" > <p:selectbooleancheckbox value="" /> </p:outputlabel> <p:separator> </p:separator> ... other elements 
first, consider usage of for attribute of <p:outputlabel> component. you're not supposed nest <p:inputtext> inside <p:outputlabel>.
next, can use <p:row> , <p:column> in order describe more complex structure of content of <p:panelgrid>.
try out this:
<p:panelgrid id="mypanel"> <f:facet name="header">projects</f:facet> <p:row> <p:column> <p:outputlabel value="project:" for="project"> <p:inputtext required="true" readonly="true" id="project"/> </p:column> <p:column> <p:outputlabel value="project title:" for="title" /> <p:inputtext readonly="true" id="title"/> </p:column> <p:column> <p:outputlabel value="is selected:" for="issel"/> <p:selectbooleancheckbox value="" id="issel"/> </p:column> <p:column> <p:outputlabel value="is approved:" for="isapp"/> <p:selectbooleancheckbox value="" id="isapp"/> </p:column> </p:row> <p:row> <p:column colspan="4"> <p:separator /> </p:column> </p:row> <p:row> <!-- other elements. --> </p:row> </p:panelgrid> you can see live demo, well.
Comments
Post a Comment