2

Well, I disabled all themes from PrimeFaces: 

<context-param>  
    <param-name>primefaces.THEME</param-name>  
    <param-value>none</param-value>  
</context-param>

I do it because I'm using bootstrap 3 and I don't want to any conflicts in jquery-ui and bootstrap layout. The problem is that PrimeFaces datatable without "themes" becomes a white table with black borders, if I use the border-style:none, the border disappears but bootstrap style border disappears as well.

Look I tried:

<div class="table-responsive">
    <p:dataTable rowKey="#{banca.id}"
                 var="banca"
                 value="#{bancaMB.beans}"
                 paginator="true"
                 emptyMessage="Não foi encontrado nenhum registro" 
                 rows="10"
                 id="dataTableBancas"
                 selection="#{bancaMB.bean}"
                 tableStyleClass="table table-striped"
                 selectionMode="single">
..
</dataTable>

Look my CSS:

.ui-datatable thead th,
.ui-datatable tbody,
.ui-datatable tbody tr,
.ui-datatable tbody td {
    border-style: none !important;
}

Look my datatable picture:

enter image description here

BalusC
  • 1,082,665
  • 372
  • 3,610
  • 3,555
Shelly
  • 1,035
  • 5
  • 27
  • 51
  • If you set the PrimeFaces theme to none, PrimeFaces components will be rendered with no themes. It is not only restricted to a `` but also several PrimeFaces' UI components will go without having a theme in them. So, even if you were to coincidentally succeed to apply a decent look/layout to data tables after the theme is set to none, the rest of the components would also require paying special attention about a theme. This should not be what you may look for. You will instead need to handle any twitter bootstrap related stuff (bootstrap layout or anything) separately anyway. – Tiny Jan 28 '15 at 03:07
  • Yes, almost all other components will fail to, look and feel wise. Since bootstrap 3 switched to a different [box-sizing](http://stackoverflow.com/questions/18854259/why-did-bootstrap-3-switch-to-box-sizing-border-box), lots and lots of small ui things will fail, like icons in selectlists being wrongly positioned etc... I doubt you want to correct all those. – Kukeltje Jan 28 '15 at 09:58
  • so, the best solution is give up and use primefaces components with bootstrap-primefaces theme ? – Shelly Jan 28 '15 at 10:24
  • Depends... What do you want to use bootstrap for? Menus? responsive ui? Components? Check e.g. this: http://www.primefaces.org/showcase/ui/data/datatable/responsive.xhtml – Kukeltje Jan 28 '15 at 15:44
  • I'm using bootstrap for responsive ui, component layouts and menus. I don't wanna enable "bootstrap-primefaces" because will conflict with bootstrap. – Shelly Jan 28 '15 at 16:15
  • Primefaces has responsive grid to… and combining the two require work… maybe bootfaces is an option http://stackoverflow.com/questions/24213655/jsf-and-primefaces-or-bootstrap-or-bootsfaces-or-both – Kukeltje Jan 28 '15 at 23:17
  • @shelly; still on SO? Please accept the answer then – Kukeltje Jul 07 '17 at 06:51

1 Answers1

2

Almost all other components will fail to, look and feel wise. Since bootstrap 3 switched to a different box-sizing (border-box instead of content-box). So lots and lots of small ui things will fail in PF components, like icons in selectlists being wrongly positioned etc... It is very difficult to fix all these in my opinion.

If you want to use bootstrap for the responsive layout things, PF something similar to, called the grid css and more is comming

Community
  • 1
  • 1
Kukeltje
  • 12,223
  • 4
  • 24
  • 47