Example for panelgrid with 2 columns?

Post Reply
User avatar
bjorntj
Posts: 214
Joined: 30 Jul 2010, 10:46

30 Jan 2016, 19:59

Just wondering if someone can provide an example on the best way to do this, using responsive design and Titan..:

I have a panelgrid with 2 columns, one column for labels and one for inputfields. The column to the right for inputfields is ok as it is but I would want the left column to not be as wide as the right column but to only use the width needed to display the label with the largest lenght. Is this possible? If so, how?


Regards,

BTJ
PrimeFaces 6.1 | Jetty 9.4.6 | Mojarra 2.2.14
Arch Linux, Firefox and Chromium

User avatar
aragorn
Posts: 2658
Joined: 29 Jun 2013, 12:38

01 Feb 2016, 14:22

I think you can use Grid Css classes in columnClasses attribute of PanelGrid with layout="grid".
http://www.primefaces.org/showcase/ui/panel/grid.xhtml

Exp;

Code: Select all

<p:panelGrid columns="2" layout="grid" columnClasses="ui-grid-col-2, ui-grid-col-10" ...>
      <h:outputLabel value="Name" />                           // added ui-grid-col-2
      <p:inputText />                                          // added ui-grid-col-10  
                                
      <h:outputLabel value="Email" />                           // added ui-grid-col-2
      <p:inputText  />                                         // added ui-grid-col-10
                                
      <h:outputLabel value="Phone" />                         // ...
      <p:inputText  />                                       // ...
</p:panelGrid>

User avatar
bjorntj
Posts: 214
Joined: 30 Jul 2010, 10:46

01 Feb 2016, 14:27

Ok, will try that... Thx... :)
PrimeFaces 6.1 | Jetty 9.4.6 | Mojarra 2.2.14
Arch Linux, Firefox and Chromium

User avatar
aragorn
Posts: 2658
Joined: 29 Jun 2013, 12:38

01 Feb 2016, 14:31

You're welcome ;)

Post Reply
  • Information
  • Who is online

    Users browsing this forum: No registered users and 1 guest