ajax event not working - primefaces

Question

I have a form that should appear when the checkbox is true. This won't work. weird thing is : I did exactly the same on another page and there it works. Also when using another boolean property in the backing bean itself it works.
<div class="field">
<p:outputLabel for="company" value="Company" />
<p:selectBooleanCheckbox id="company" value="#{participantDetailBean.participant.isCompany}">
<p:ajax event="change" update="companyFields"/>
</p:selectBooleanCheckbox>
</div>
<p:outputPanel id="companyFields">
<div class="field">
<p:outputLabel for="companyname" value="Company name" rendered="#{participantDetailBean.participant.isCompany}" />
<p:inputText id="companyname" value="#{participantDetailBean.participant.companyName}" rendered="#{participantDetailBean.participant.isCompany}" />
</div>
<div class="field">
<p:outputLabel for="companyform" value="Company form" rendered="#{participantDetailBean.participant.isCompany}" />
<p:inputText id="companyform" value="#{participantDetailBean.participant.companyForm}" rendered="#{participantDetailBean.participant.isCompany}" />
</div>
<div class="field">
<p:outputLabel for="companynumber" value="Company number" rendered="#{participantDetailBean.participant.isCompany}" />
<p:inputMask id="companynumber" value="#{participantDetailBean.participant.companyNumber}" mask="aa 9999.999.999" rendered="#{participantDetailBean.participant.isCompany}" />
</div>
</p:outputPanel>

Answer 1

Sometimes Primefaces has its moments when components that works on one page, simply refuses to work on another page. The code you've posted in your example is correct and most likely if you place a break point on the company getter, when the ajax event change is triggered, the value will update correctly. What's happening is that your component is not refreshing correctly via the ajax (or is not recognized).
A workaround solution that I found is to this scenario is to include JSF's PanelGroup inside the OutputPanel. I used the base of your code and made the below example (obviously replacing tags I have in my project with the objects as per your example.
<div class="field">
<p:selectBooleanCheckbox id="company"
value="# {participantDetailBean.participant.isCompany}">
<p:ajax event="change" update=":companyFields"/>
</p:selectBooleanCheckbox>
</div>
<p:outputPanel id="companyFields">
<h:panelGroup id="companyFields2" rendered="#{participantDetailBean.participant.isCompany}">
<div class="field">
<p:outputLabel value="DISPLAY THIS FIELD"/>
</div>
</h:panelGroup>
</p:outputPanel>
Whilst this is not the cleanest solution, it might help you get out of the rut you're currently stuck in, or guide you in obtaining the correct answer. Oh, and don't forget to include the JSF include tag when using PanelGroup
xmlns:h="http://xmlns.jcp.org/jsf/html"

Answer 2

Try to use the itemSelect event.