11 Replies Latest reply on Mar 30, 2011 4:34 AM by Ilya Shaikovsky

    reRendering is not working after file upload using <rich:fileUpload> component

    prasad basutkar Newbie

      Hi All

       

      Requirement : i am using rich faces 3.3.1 and i want to reRender panel(component in the same page) after uploading file using <rich:fileUpload> tag.

       

      Description : As soon i upload the file ,  listner is calling and all the uploading is working perfectly , but onUploadCompleted event i want to reRender panel(component in the same page) which is showing the list of all the uploaded files , but sometime this panel gets reRender and somtimes it dosent ,for reRendering i am using <a4j:support event="onuploadcomplete"   reRender="info" /> under <rich:fileUpload> tag . list of files getting updated in the bean after upload event only problem is reRendering of list in jsf.

        • 1. Re: reRendering is not working after file upload using <rich:fileUpload> component
          Ilya Shaikovsky Master

          have you checked sources of richfaces-demo? If you updating list of images as there shown and using media output for preview them - you have to use workaround from with timestamp there.

          • 2. Re: reRendering is not working after file upload using <rich:fileUpload> component
            Sunay Shah Apprentice

            Hello Ilya,

             

            Even i face the same problem, Now it is not all time problem that list is not updating , some times it behaves correctly, but some time it is not able to update the list. and when you press browser refresh button on f5 will update the list. Is this issue related to Ajax rendering ? I tried with your suggested way but not resolve issue. I am working with Window XP  , Firefox , richfaces 3.3.1 and it gives this issue very rarely, the above problem is more noticable when windows7 , Firefox / IE , richfaces 3.3.1

             

             

            Thanks

            Sunay

            • 4. Re: reRendering is not working after file upload using <rich:fileUpload> component
              Sunay Shah Apprentice

              <a4j:keepAlive beanName="fileUploadBean" />
                      <a4j:outputPanel id="info" ajaxRendered="true">
                      <h:panelGrid columns="2" columnClasses="top,top">
                          <rich:fileUpload fileUploadListener="#{fileUploadBean.listener}"
                              maxFilesQuantity="#{fileUploadBean.uploadsAvailable}"
                              id="upload"
                              noDuplicate="true"
                              uploadControlLabel="Done"
                              immediateUpload="true"
                              stopButtonClass="..."
                              cleanButtonClass="..."
                               allowFlash="#{fileUploadBean.useFlash}" listHeight="0px" listWidth="70px">
                               <a4j:support event="onupload"  reRender="info,upload,files" />
                               <a4j:support event="onuploadcomplete"   reRender="info,upload,files" />
                               <a4j:support event="onfocus" reRender="info,upload,files"/>
                               <a4j:support event="onclear" action="#{fileUploadBean.clearUploadData}" reRender="info,upload,files" />
                               <f:param value="#{fileUploadBean.timeStamp}" name="time"/> 
                          </rich:fileUpload>                    
                             <rich:panel style="margin:1px;" bodyClass="info">
                                 <f:facet name="header">
                                     <h:outputText value="Attached Files" />
                                 </f:facet>
                                 <h:outputText value="None attached"
                                     rendered="#{fileUploadBean.size==0}" />
                                 <rich:dataGrid style="margin:1px;" rendered="#{fileUploadBean.size > 0}"  id="files" columns="1" value="#{fileUploadBean.files}"
                                     var="file" rowKeyVar="row">
                                          <a4j:commandLink styleClass="docAttachLink" rendered="#{fileUploadBean.size > 0}"  value="#{file.name}"                          onclick="..."/>
                                           <a4j:commandLink reRender="info,upload" rendered="#{fileUploadBean.size > 0}"  action="#{fileUploadBean.deleteFile}">                                        
                                  <h:graphicImage alt="delete" value="/images/delete.gif" styleClass="docAttachDelete"/>
                                  <f:setPropertyActionListener target="#{fileUploadBean.fileToDelete}" value="#{file.name}" />
                                           </a4j:commandLink>
                                 </rich:dataGrid>
                             </rich:panel>                                  
                      </h:panelGrid>
                      </a4j:outputPanel>          

              • 5. Re: reRendering is not working after file upload using <rich:fileUpload> component
                Ilya Shaikovsky Master

                check rf-demo page which I talked about. f:param should be used for output component and not for upload.

                • 6. Re: reRendering is not working after file upload using <rich:fileUpload> component
                  Sunay Shah Apprentice

                  I am not concerned about to display image , so do i need to take <a4j:mediaOutput> ?

                   

                  I want to only add the <a4j:commandLink> , can you tell me the reason for taking <f:param> ?

                   

                   

                  Thanks

                  Sunay

                  • 7. Re: reRendering is not working after file upload using <rich:fileUpload> component
                    Ilya Shaikovsky Master

                    sorry missed code details as it looked very similar to the code used at demo.

                     

                    Bad things in your code :

                     

                    • ajaxRendered around upload could cause it's broken as it probably will be updated after all the request including polling for upload status.
                    • reRendering dataGrid which is conditionally rendered (as any other conditionally rendered component) will not cause it to appear. some wrapper parent should be updated as ajax can't insert elements but only update existent.

                     

                    If the problem will exist after corrections - repost code and provide a4j:log output.

                    • 8. Re: reRendering is not working after file upload using <rich:fileUpload> component
                      Sunay Shah Apprentice

                      Hello Ilya,

                       

                       

                      debug[13:38:48,788]: Header  Ajax-Expired not found, search in <meta>
                      debug[13:38:48,789]: search for elements  by name 'meta'  in element #document
                      debug[13:38:48,791]: Find <meta  name='Ajax-Update-Ids' content=''>
                      debug[13:38:48,792]: Find <meta  name='Ajax-Response' content='true'>
                      debug[13:38:48,792]: call getElementById for id=  _ajax:data
                      debug[13:38:48,793]:  Call local onbeforedomupdate function before replacing  elemements
                      debug[13:38:48,793]:  Header Ajax-Update-Ids not found, search in <meta>
                      debug[13:38:48,793]: search for  elements by name 'meta'  in element #document
                      debug[13:38:48,796]: Find <meta  name='Ajax-Update-Ids' content=''>
                      warn[13:38:48,796]: No information in response about  elements to replace
                      debug[13:38:48,797]:  call getElementById for id= org.ajax4jsf.oncomplete
                      debug[13:38:48,797]: Processing updates  finished, no oncomplete function to call
                      debug[13:38:48,797]: call getElementById for id=  ajax-view-state
                      debug[13:38:48,798]:  Hidden JSF state fields: [object HTMLSpanElement]
                      debug[13:38:48,798]: Namespace for  hidden view-state input fields is undefined
                      debug[13:38:48,799]: search for elements  by name 'input'  in element span
                      debug[13:38:48,801]: Replace value for inputs: 14 by  new values: 1
                      debug[13:38:48,801]:  Input in response: javax.faces.ViewState
                      debug[13:38:48,802]: Found same input on  page with type: hidden
                      debug[13:38:48,802]:  Found same input on page with type: hidden
                      debug[13:38:48,803]: search for elements  by name 'INPUT'  in element span
                      debug[13:38:48,805]: Replace value for inputs: 14 by  new values: 0
                      debug[13:38:48,805]:  call getElementById for id= _A4J.AJAX.focus
                      debug[13:38:48,806]: No focus  information in response
                      this is the log for the  following code
                      <h:panelGrid columns="2" columnClasses="top,top">
                                  <rich:fileUpload fileUploadListener="#{fileUploadBean.listener}"
                                      maxFilesQuantity="#{fileUploadBean.uploadsAvailable}"
                                      id="upload"
                                      noDuplicate="true"
                                      uploadControlLabel="Done"
                                      immediateUpload="true"
                                      stopButtonClass="enovateStopButton"
                                      cleanButtonClass="enovateCleanButton"
                                       allowFlash="#{fileUploadBean.useFlash}" listHeight="0px" listWidth="70px">
                                            <f:param value="#{fileUploadBean.timeStamp}" name="time"/> 
                                       <a4j:support event="onupload"  reRender="info,upload,files" />
                                       <a4j:support event="onuploadcomplete"   reRender="info,upload,files" />
                                       <a4j:support event="onfocus" reRender="info,upload,files"/>
                                       <a4j:support event="onclear" action="#{fileUploadBean.clearUploadData}" reRender="info,upload,files" />                  
                                  </rich:fileUpload>                      
                                     <rich:panel style="margin:1px;" bodyClass="info">
                                         <f:facet name="header">
                                             <h:outputText value="Attached Files" />
                                         </f:facet>
                                         <h:outputText value="None attached"
                                             rendered="#{fileUploadBean.size==0}" />
                                         <rich:dataGrid style="margin:1px;" id="files" columns="1" value="#{fileUploadBean.files}"
                                             var="file" rowKeyVar="row">                  
                                                  <a4j:commandLink styleClass="docAttachLink" rendered="#{fileUploadBean.size > 0}"  value="#{file.name}" onclick="open_win('../filestore/#{instanceId}/#{varName}_#{fileUploadBean.taskId}/#{file.name}')">
                                                 
                                                  </a4j:commandLink>
                                                   <a4j:commandLink reRender="info,upload" rendered="#{fileUploadBean.size > 0}"  action="#{fileUploadBean.deleteFile}">                                         
                                        <h:graphicImage alt="delete" value="/images/delete.gif" styleClass="docAttachDelete"/>
                                            <f:setPropertyActionListener target="#{fileUploadBean.fileToDelete}" value="#{file.name}" />
                                                   </a4j:commandLink>
                                         </rich:dataGrid>
                                     </rich:panel>                                     
                              </h:panelGrid>    

                       

                      Hello Ilya,

                      I want to know the exact reason for better understanding why we are setting <f:param> is it related to resolve the problem of cashing issue or something.. still the problem is there page is not everytime is refreshing some time able to some time not. it gives the warning

                       

                      No information in response about elements to replace

                       

                      Thanks

                      Sunay

                      • 9. Re: reRendering is not working after file upload using <rich:fileUpload> component
                        Sunay Shah Apprentice

                        Thanks Ilya,

                         

                        error is in design of the form works like a charm

                        • 10. Re: reRendering is not working after file upload using <rich:fileUpload> component
                          Desi Ivanova Newbie

                          Hi Sunay,

                           

                          I'm facing the same problem and can't find what's wrong with my jsf design and a4j:support doesn't success with rerendering components. Please explain what do you change to make this working?

                           

                          Thanks in advance!

                          Desi

                          • 11. Re: reRendering is not working after file upload using <rich:fileUpload> component
                            Ilya Shaikovsky Master

                            do not use many threads for posting. http://community.jboss.org/message/596198#596198 We will not know where to answer then and it will be not easy for you to find our answers.