p：ajax渲染后p：fileUpload无法正常工作

Question

I´m getting confused why the component p:fileUpload doesn´t call the fileUploadListener once the component is shown by the p:ajax . If I put it outside the panelGrid s or even remove them, works just fine.

What isn´t working:

<div class="pure-control-group"> 
    <label for="mostraNoIndex">Slideshow</label>
    <p:selectBooleanCheckbox value="#{destaqueCadastrarBean.d.apareceNoSlide}">
        <p:ajax event="change" update="upload"></p:ajax>
    </p:selectBooleanCheckbox>
</div>                                      

<h:panelGrid id="upload">
    <h:panelGrid rendered="#{destaqueCadastrarBean.d.apareceNoSlide}">
        <div class="pure-control-group"> 
            <label for="mostraNoIndex">Imagem</label>
            <p:fileUpload fileUploadListener="#{destaqueCadastrarBean.handleFileUpload}" mode="advanced" dragDropSupport="true" sizeLimit="100000000000" fileLimit="1" allowTypes="/(\.|\/)(gif|jpe?g|png)$/" />                                    
        </div>
   </h:panelGrid>
</h:panelGrid>

What works:

<div class="pure-control-group"> 
    <label for="mostraNoIndex">Slideshow</label>
    <p:selectBooleanCheckbox value="#{destaqueCadastrarBean.d.apareceNoSlide}">
    </p:selectBooleanCheckbox>
</div>  

<div class="pure-control-group"> 
    <label for="mostraNoIndex">Imagem</label>
    <h:fileUpload fileUploadListener="#{destaqueCadastrarBean.handleFileUpload}" mode="advanced" dragDropSupport="true" sizeLimit="100000000000" fileLimit="1" allowTypes="/(\.|\/)(gif|jpe?g|png)$/" />                                    
</div>

Answer 1

Just found out a solution for it. The bean being called was RequestScoped , changed it to ViewScoped . I guess cause the bean was requested when the form loaded and p:fileUpload can only appears after the creation of the bean, the component couldn´t reach the bean. With view scope the bean is available for components that comes afterward. If someone has a more technical and clear explanation I would like to understand better.