rich:fileUpload component conflicting with default styles of rich input components

[javaxchange]

Hi,

I am using richfaces4.2.2 and facing a weird problem in the way it is behaving. I have some set of pages and I am including those in a single form inside <ui:define> and rendering the pages at runtime one at a time as below

< ui:define name="body">

<h:form id="frmContent">
          <h:panelGroup id="frmContentPanel">

                 <ui:fragment rendered="#{utilBean.pageName eq 'p1'}">
                            <ui:include src="/pages/page1.xhtml" />
                 </ui:fragment>
                 <ui:fragment rendered="#{utilBean.pageName eq 'p2'}">
                            <ui:include src="/pages/page2.xhtml" />
                 </ui:fragment>

                 <ui:fragment rendered="#{utilBean.pageName eq 'p3'}">
                            <ui:include src="/pages/page3.xhtml" />
                 </ui:fragment>

         </h:panelGroup>
</h:form>

</ ui:define>

I have a fileUpload component in page1 and inputNumberSpinner in page2 and autocomplete in page3. In this scenario, the default styles I have overrided in each page for previously said compnents are not working and look itself goes so weird. If I include page2 first, the problem with inputNumberSpinner will go away and if I keep page3 in the first place the problem with autocomplete component also will go away. But I cannot keep doing this as I have so many pages and in many places I am using these components. I doubt simillar issues can come for other rich input components also.

I wish somebody can help me out on this issue.

Thanks!

[michpetrov]

Hi,

this is caused by JSF, it looks on the page and loads only the resources it needs, and since you're not refreshing the page it doesn't load the rest. You can use Resource Optimization to fix it.

On the other hand, why don't you just have:

<h:form id="frmContent">
          <h:panelGroup id="frmContentPanel">
                            <ui:include src="#{utilBean.page}" />
          </h:panelGroup>
</h:form>

where page is the relative link. You are only displaying one page at a time.

[javaxchange]

Thanks for the reply.

<h:form id="frmContent">
          <h:panelGroup id="frmContentPanel">
                            <ui:include src="#{utilBean.page}" />
          </h:panelGroup>
</h:form>

First I have tried this option only. But what was happening is when I am rendering the form "frmContent"  from a menuitem which is outside the form "frmContent" , the styles of the content part is not getting loaded properly . I have to refresh the page again to make get it's normal look.

And in the way I have tried, even after refreshing the page , styles are not working.