8 Replies Latest reply on May 6, 2009 5:51 AM by Ilya Shaikovsky

    JavaScript Error When Uploading in IE

    Tim Lawson Newbie

      Hi all,

      I'm trying to eliminate everything from the richfaces fileupload except the Add button but I've run into a problem in Internet Explorer 7. If you create a page using the code below, load it in your browser, and click the "Add Test..." button in IE7 it will give you a JavaScript error. This doesn't happen in Firefox or Safari, and if you changed the listWidth attribute to 122px IE no longer gives the error.

      Any ideas how I can fix this? Or is this something I have to wait for RichFaces to fix? Or maybe suggestions on a different way to go about eliminating everything except the Add button?

      Cheers!

      <%@ taglib uri="http://richfaces.org/rich" prefix="rich"%>
      <%@ taglib uri="http://java.sun.com/jsf/html" prefix="h"%>
      <%@ taglib uri="http://java.sun.com/jsf/core" prefix="f"%>
      <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
      "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
      <html>
       <head>
       <style type="text/css">
       .hiddenButton {
       display: none;
       }
       </style>
       </head>
       <body>
       <f:view>
       <h:form>
       <rich:fileUpload
       addControlLabel="Add Test..."
       immediateUpload="true"
       listHeight="0px"
       listWidth="121px"
       stopButtonClass="hiddenButton"
       cleanButtonClass="hiddenButton"/>
       </h:form>
       </f:view>
       </body>
      </html>
      


        • 3. Re: JavaScript Error When Uploading in IE
          Jonas Buechel Novice

          I'm facing exactly the same problem.

          Did you get it working somehow?

          • 4. Re: JavaScript Error When Uploading in IE
            Nick Belaevski Master

            Hello,

            I couldn't reproduce the issue. Can you please post complete page code you are having problems with?

            • 5. Re: JavaScript Error When Uploading in IE
              Jonas Buechel Novice

              Sure. I simplyfied the page but it's still quite a bunch of code. Hopefully it helps.
              Richfaces: 3.3.0.GA
              Seam: 2.1.1.GA

              /modules/myportal/profile/uploadPicture.xhtml:

              <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
               "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
              <ui:composition xmlns="http://www.w3.org/1999/xhtml" xmlns:s="http://jboss.com/products/seam/taglib"
               xmlns:ui="http://java.sun.com/jsf/facelets" xmlns:f="http://java.sun.com/jsf/core"
               xmlns:h="http://java.sun.com/jsf/html" xmlns:rich="http://richfaces.org/rich"
               xmlns:a4j="http://richfaces.org/a4j" xmlns:c="http://java.sun.com/jstl/core">
              
               <ui:param name="capoRenderTransformWidth"
               value="#{pictureUtil.transformWidth(capoPictureData, capoPictureWidth, capoPictureHeight)}" />
              
               <s:div id="uploadPictureContainer" style="text-align: center;">
              
               <!-- Display picture -->
               <s:div rendered="#{not empty capoPictureData and not pictureUploadAction.editPicture}"
               style="position: relative; width: #{capoPictureWidth}px; height: #{capoPictureHeight}px;">
              
               <s:graphicImage id="uploadPicture" value="#{capoPictureData}">
               <s:transformImageSize rendered="#{capoRenderTransformWidth}" width="#{capoPictureWidth}"
               maintainRatio="true" />
               <s:transformImageSize rendered="#{!capoRenderTransformWidth}" height="#{capoPictureHeight}"
               maintainRatio="true" />
               </s:graphicImage>
              
               <s:div id="uploadPictureControls" styleClass="portal-change-picture-controls">
               <div><a4j:commandLink value="#{messages.controls_change_uploadPicture}"
               action="#{pictureUploadAction.setEditPicture(true)}" reRender="uploadPictureContainer" /></div>
               </s:div>
              
               </s:div>
              
               <s:div style="" rendered="#{empty capoPictureData or pictureUploadAction.editPicture}">
               <h:outputText value="#{capoPictureUploadInfo}" />
               </s:div>
              
               <s:div rendered="#{empty capoPictureData or pictureUploadAction.editPicture}"
               style="text-align: left;">
               <rich:fileUpload uploadData="#{pictureUploadAction.uploadItems}"
               fileUploadListener="#{pictureUploadAction.uploaded}" acceptedTypes="png, jpeg, jpg, gif"
               listWidth="121px" listHeight="0px" addControlLabel="#{messages.controls_upload_uploadPicture}"
               immediateUpload="true" autoclear="true">
               <a4j:support event="onuploadcomplete" oncomplete="reRenderPictureContainer();" />
               <f:param name="pictureType" value="#{capoPictureType}" />
               </rich:fileUpload>
               </s:div>
              
               <s:div style="margin-top: 5px;"
               rendered="#{not empty capoPictureData and pictureUploadAction.editPicture}">
               <div><a4j:commandLink value="#{messages.controls_remove}"
               action="#{pictureUploadAction.removePicture}" reRender="uploadPictureContainer" /></div>
               <div style="margin-top: 3px;"><a4j:commandLink value="#{messages.controls_cancel}"
               action="#{pictureUploadAction.setEditPicture(false)}" reRender="uploadPictureContainer" /></div>
               </s:div>
              
               <a4j:jsFunction name="reRenderPictureContainer" reRender="uploadPictureContainer" />
               </s:div>
              
              </ui:composition>
              


              test.html (referenced page using test.seam):
              <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
               "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
              <html xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml"
               xmlns:ui="http://java.sun.com/jsf/facelets"
               xmlns:h="http://java.sun.com/jsf/html" xmlns:f="http://java.sun.com/jsf/core"
               xmlns:s="http://jboss.com/products/seam/taglib" xmlns:rich="http://richfaces.org/rich"
               xmlns:fwc="http://www.frox.com/jsf/froxwebcomponents" xmlns:a4j="http://richfaces.org/a4j">
               <head>
               <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
               <meta name="description" content="#{messages.metatag_description}" />
               <meta name="keywords" content="#{messages.metatag_keywords}" />
               <meta name="robots" content="index,follow" />
               <title>
               <ui:insert name="fwcPageTitle">#{fwcWindowTitle}</ui:insert>
               </title>
              
               <!-- Loads all required css using the FwcResource loader. Could be done through the
               a4j:loadStyle, but then a change in the css file would require a AppServer restart.
               <link href="#{facesContext.externalContext.request.contextPath}#{fwcResource.resourcePathWeb}#{theme.css}" rel="stylesheet" type="text/css" /> -->
               <link href="#{facesContext.externalContext.request.contextPath}#{fwcResource.resourcePathWeb}/common/css/fwcComponents.css" rel="stylesheet" type="text/css" />
              
               <link href="#{facesContext.externalContext.request.contextPath}/layout/reset-fonts-grids.css" type="text/css" rel="stylesheet" />
               <link href="#{facesContext.externalContext.request.contextPath}/layout/custom.css" type="text/css" rel="stylesheet" />
               <ui:insert name="fwcHead" />
               </head>
              
               <body>
               <f:view contentType="text/html">
              
               <ui:define name="fwcContent">
              
               <a4j:form enctype="multipart/form-data">
               <s:decorate template="/modules/myportal/profile/uploadPicture.xhtml">
               <ui:param name="capoPictureData" value="#{memberHome.instance.personalData.profilePicture}" />
               <ui:param name="capoPictureType" value="PROFILE_PICTURE" />
               <ui:param name="capoPictureWidth" value="102" />
               <ui:param name="capoPictureHeight" value="136" />
               <ui:param name="capoPictureUploadInfo" value="#{messages.member_uploadPictureMember_text}" />
               </s:decorate>
               </a4j:form>
              
               </ui:define>
              
               </f:view>
              
               </body>
              </html>
              


              • 6. Re: JavaScript Error When Uploading in IE
                Mikhail Vitenkov Newbie

                Reproducible under 3.3.0.GA - JS error appears in IE.
                Under 3.3.1.CR2 - example, listed above, works fine.
                jbuechel, try to use the latest RF snapshot. Let us know, if problem remains.

                • 7. Re: JavaScript Error When Uploading in IE
                  Jonas Buechel Novice

                  Hi mvitenkov,

                  thanks for your quick response!

                  I tried 3.3.1.CR2 and snapshot 3.3.1-20090506.040410-81.
                  Unfortunately with both releases I still got the JS error...

                  I double-checked if the new richfaces jar files has been deployed correctly.

                  The IE version: 7.0.5730.11

                  IE8 (8.0.6001.18702) says as detailed error message:

                  Webpage error details
                  
                  User Agent: Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 5.1; Trident/4.0; .NET CLR 1.1.4322)
                  Timestamp: Wed, 6 May 2009 09:15:29 UTC
                  
                  
                  Message: Invalid argument.
                  Line: 16
                  Char: 48
                  Code: 0
                  URI: http://192.168.81.215/a4j/g/3_3_1-SNAPSHOTorg/richfaces/renderkit/html/js/FileUpload.js
                  


                  Am I doing something wrong?