1

Primefaces p:selectBooleanCheckBox does not display the Check Mark when clicked. We have for example:

<p:dataTable>
....
  <p:column selectionMode="multiple" </p:column>
......
</p:dataTable>

What this renders is

<TABLE role="grid">
  <THEAD id="displayForm:tblPositionList_head">
  <TR role="row">
   <TH class="ui-state-default ui-selection-column" id="displayForm:tblPositionList:j_idt166" 
   role="columnheader" style="width: 13px; text-align: center;" 
  scope="col"><SPAN class="ui-column-title"></SPAN>
  <DIV class="ui-chkbox ui-chkbox-all ui-widget">
  <DIV class="ui-helper-hidden-accessible"><INPUT name="displayForm:tblPositionList_checkbox" 
  aria-checked="false" aria-label="Select All" type="checkbox"></DIV>
  <DIV class="ui-chkbox-box ui-widget ui-corner-all ui-state-default"><SPAN 
  class="ui-chkbox-icon ui-icon ui-icon-blank ui-c"></SPAN></DIV></DIV></TH>
  <TH class="ui-state-default" id="displayForm:tblPositionList:j_idt167" 
  role="columnheader" style="width: 30px;" aria-label="Details" 
  scope="col"><SPAN class="ui-column-title">Details</SPAN></TH>
  <TH class="ui-state-default" id="displayForm:tblPositionList:j_idt169" 
  role="columnheader" style="width: 51px; text-align: center;" aria-label="Edit" 
  scope="col"><SPAN class="ui-column-title">Edit</SPAN></TH>
  <TH class="ui-state-default" id="displayForm:tblPositionList:j_idt170" 
  role="columnheader" style="width: 51px; text-align: center;" aria-label="Delete" 
  scope="col"><SPAN class="ui-column-title">Delete</SPAN></TH>

But the above does not show the check mark when clicked. Note however that the functionality works well - which means it really checks and unchecks. Just the display of the check mark is not.

stefan-dan
  • 586
  • 5
  • 19
prain99
  • 21
  • 5
  • 1
    Are you sure you also didn't update PrimeFaces versions in this migration? I doubt JBOSS EAP vs WebLogic is causing a CSS issue with PF. Only a Theme or PF Version would cause a change in behavior. – Melloware Mar 04 '21 at 12:36
  • Yes. Primefaces 7 is what we used in jboss EAP and in Weblogic. We basically use the same POM.xml except for few mods for Weblogic. – prain99 Mar 05 '21 at 13:15
  • OK does Weblogic use Mojarra or MyFaces? could be a difference also. – Melloware Mar 05 '21 at 15:39
  • I do not have an answer for that. How do I check that? – prain99 Mar 06 '21 at 17:43
  • https://stackoverflow.com/questions/20083068/how-to-find-out-the-current-version-of-mojarra-which-my-weblogic-is-using – Melloware Mar 06 '21 at 18:12
  • @prain99 please remove the weblogic tag, because it is not related. – stefan-dan Mar 19 '21 at 08:49

2 Answers2

2

Check the primefaces theme in the web.xml

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

If the theme is set to none, then the checkmark will not be shown.

You can use a theme, or replace all

<p:selectBooleanCheckBox>

with

<h:selectBooleanCheckBox>

Then the component will be rendered with the default browser style.

stefan-dan
  • 586
  • 5
  • 19
  • 1
    I will check the web.xml. Btw, yes we changed the p:select.... to h:select... checkboxes. As long as they are outside a p:dataTable it's ok . But the multi select p:dataTable checkboxes (like the one shown below) do not show check mark. I do not know how to force primefaces to change the checkbox type from p: to h: in p:dataTable components. – prain99 Mar 18 '21 at 22:56
  • They have changed default `` to `
    `. You can't change the source code, but you can open an issue. https://github.com/primefaces/primefaces/issues/new/choose
    – stefan-dan Mar 19 '21 at 08:48
  • This is what we have in our web.xml primefaces.THEME none – prain99 Mar 19 '21 at 15:33
1

Actually the check mark is there but it is white on a white background - barley visible! I had / wanted to continue using the Boostrap Theme.

Only a CSS style override in my own.css file included in the template could bring the checkbox tick back to black color.

.ui-state-highlight .ui-icon {
    background-image:url("/your/path/resources/images/ui- 
    icons_333333_256x240.png?ln=primefaces-bootstrap&v=10.0.0&e=10.0.0");
 }
 in the template
 <h:head><link href="/reg/css/own.css" rel="stylesheet" /></h:head>

Overrides ui-icons_ffffff_256x240.png out of the theme.css.

MacNord
  • 141
  • 1
  • 2
  • 9