Primefaces 2.2.1 and IE 7/8 JavaScript Errors

[cgswtsu78]

Hello,

First off, I have been greatly impressed with Primefaces capabilities and it has a ton of helpful features. One thing I'm running into is issues with FileUpload component and slider component throwing JS errors in IE 7 and 8. I had to switch to a jqueryui slider but really want to use the fileupload component. It does work in all browsers but throws a JS error only in IE 7 and 8 once the upload is completed. The JS error says 'null' is null or not an object, any ideas?

xhtml:

Code: Select all

<p:panel id="fileUpload">
		<p:fileUpload widgetVar="uploader" rendered="#{dreamFileUploadBean.shouldRender}" sizeLimit="10485760"
							styleClass="browse-button" fileUploadListener="#{dreamFileUpload.handleFileUpload}" wmode="transparent" 
							image="/dreamcater/images/Browse-Button.png" auto="true" multiple="false" customUI="true" 
    							allowTypes="*.jpg;*.png;*.gif;" description="Images" update=":uploadFrm:next,:uploadFrm:fileUpload" onclick="trackingBrowseBtn();"/> 
	</p:panel>

html source rendered:

Code: Select all

<div id="uploadFrm:fileUpload" class="ui-panel ui-widget ui-widget-content ui-corner-all"><div id="uploadFrm:fileUpload_content" class="ui-panel-content ui-widget-content"><span id="uploadFrm:j_idt105" class="browse-button"><input type="file" id="uploadFrm_j_idt105_file" name="uploadFrm_j_idt105_file" /></span><script type="text/javascript">jQuery(function() {uploader = new PrimeFaces.widget.Uploader('uploadFrm:j_idt105', {uploader:'/dreamcatcher/javax.faces.resource/fileupload/uploadify.swf.html?ln=primefaces&v=2.2.1',script:'/dreamcatcher/registered/home.html',cancelImg:'/dreamcatcher/javax.faces.resource/fileupload/cancel.png.html?ln=primefaces&v=2.2.1',formId:'uploadFrm',fileDataName:'uploadFrm_j_idt105_file',multi:false,auto:true,inputFileId:'uploadFrm_j_idt105_file',jsessionid:'48F682CD81B95AAF1A359E7252D2F8F9',update:'uploadFrm:next uploadFrm:fileUpload',buttonImg:'/dreamcatcher/dreamcater/images/Browse-Button.png',fileExt:'*.jpg;*.png;*.gif;',fileDesc:'Images',sizeLimit:10485760,wmode:'transparent'});});</script>
</div></div><script type="text/javascript">widget_uploadFrm_fileUpload = new PrimeFaces.widget.Panel('uploadFrm:fileUpload', {visible:true});</script>
</div>
</div>

[tagedieb]

Hi,

I'm using Primefaces 3.0M1, but I got the same JS error.
Is there a fix or a workaround for this? I have checked other forums as well and found the same question, but nobody knows a solution..

Thanks

[cagatay.civici]

What javascript error?

[tagedieb]

I solved the problem.

It was related to Spring WebFlow and it is caused by the missing request headers "(X-Requested-With" and "Faces-Request") when the browser (IE) uses the JS 'handleLegacyUpload' instead of 'handleFiles'.
If these headers are missing then WebFlow will not handle the request as AJAX request and therefore return the full page instead of the partial update.

This caused the JS error saying 'null' is null or not an object because it couldn't find the <update> tag in the response.

As a quickfix I updated the MultipartRequest and added the 2 request headers above to simulate an AJAX request. Now it fits perfectly.
This solution will probably only support Ajax uploads.

[balajilsm]

Hi

We are also using spring webflow with ajax updates. We are also facing the same issues.
Can u please give me some more information about your solution

Thanks,
Balaji