primefaces tristatecheckbox label left side

Question

How do I place the itemLabel for the primefaces TriStateCheckbox on the left side of the checkbox instead of the default right position.

<p:triStateCheckbox value="#{handler.readyFlag}" 
        itemLabel="#{labels.aktiv}"
        converter="triStateConverter">
                <p:ajax event="change" update="workflowEventTbl"
                        listener="#{handler.createDataModel}"
                        partialSubmit="true"/>
</p:triStateCheckbox>

Workaround: I can put a label in front of it, but then it is not "clickable" like the label on the TriStateCehckbox

<h:outputText value="#{labels.aktiv}"/>
<p:triStateCheckbox value="#{handler.readyFlag}"
    converter="triStateConverter">
        <p:ajax event="change" update="workflowEventTbl"
                listener="#{handler.createDataModel}"
                partialSubmit="true"/>
</p:triStateCheckbox>

Jasper de Vries · Answer 1 · 2019-06-06T12:39:31.830

3

You could create CSS rule to float to label to the left. For example:

html .ui-chkbox .ui-chkbox-label {
  float: left;
}

Of course you could add a style class to your p:triStateCheckbox and create a more specific rule.

primefaces tristatecheckbox label left side

1 Answers1