Opened 9 years ago

Closed 9 years ago

Last modified 8 years ago

#12308 closed defect (fixed)

FileUploader IE9

Reported by: Mike Wilcox Owned by: Mike Wilcox
Priority: high Milestone: 1.5.2
Component: DojoX Form Version: 1.6.0b1
Keywords: Cc:
Blocked By: Blocking:

Description

There is a bug in IE9 that causes the FileUploader? to not work in html mode (using an iframe). Attempts to fix it have not been successful and caused more bugs.

Suggested workarounds:

  • Use dojox.form.Uploader
  • If using FileUploader?, do a browser sniff for IE9 (or just IE) and if so, force flash mode (in general IE works better with flash mode anyway, while other browsers work better with html mode)

Suggested fixes or patches welcome.

Related issue: http://bugs.dojotoolkit.org/ticket/12273

Attachments (1)

FileUploader-ie9.diff (474 bytes) - added by noddie 9 years ago.
IE9 patch diffed from revision 23803

Download all attachments as: .zip

Change History (11)

comment:1 Changed 9 years ago by noddie

When using force="html" I was able to fix my problems using FileUploader? in IE9 by changing line number 1092 from:

if(dojo.isIE){ 

to

if(dojo.isIE < 9){

I haven't checked with older versions of Internet explorer, but I persume that this fix does not brake anything since it only checks for IE versions less than 9 instead of simply IE.

Changed 9 years ago by noddie

Attachment: FileUploader-ie9.diff added

IE9 patch diffed from revision 23803

comment:2 Changed 9 years ago by Mike Wilcox

I tried it, it doesn't work. It gets past the initial parsing bug, but then it doesn't upload. I think there is a problem in general with IE9 doing an ajax post.

Related problem found here: http://stackoverflow.com/questions/4109390/dojo-ajax-calls-dont-work-in-ie9-beta

BTW, it should be: if(dojo.isIE && dojo.isIE < 9)

Thanks for the idea though. I'm thinking of just disallowing HTML uploads for IE9.

comment:3 Changed 9 years ago by noddie

I just tested this before I wrote the commend, and it uploads very well on my use case. I don't have the time to write up a testcase, but here's the code I used:

<script language="javascript" type="text/javascript">
dojo.require("dojox.form.FileUploader");
dojo.require("dojox.embed.Flash");

 var fileMask = [
                    ["Jpeg File",   "*.jpg;*.jpeg"],
                    ["GIF File",    "*.gif"],
                    ["PNG File",    "*.png"],
                    ["All Images",  "*.jpg;*.jpeg;*.gif;*.png"]
                ];

dojo.addOnLoad(function(){
    	dojox.embed.Flash.available = 0; //our clients don't have flash, so make sure this works w/o flash
    	var f0 = dijit.byId('btn0');
    	
        f0.fileMask = fileMask;
      
        dojo.connect(f0, "onComplete", function(data){
            
            dojo.forEach(data, function(d){
            	if(console) {
            		console.log(d);
            	}
            	if(d.name) {
            	   // show the newly uploaded file in a thumbnail, id=0 makes the ajax handler return the last uploaded
            	    var img = dojo.create("img",{src: "showProductImage.ajax?id=0",height: "50", width: "50"},dojo.byId("uploadimage"),"only");
            	} else {
            		dojo.byId("uploadimage").innerHTML = '<%=m.getString("PrepareReservations.IOError")%>';
            	}
            });
        });
    });
</script>

<form name="saveNewForm" method="POST" action="/posthandlerServlet" >
 <table class="report">
 <tr class="Tableheader">
            <td class="TableHeaderOverview"><%=m.getString("productOverview.Name") %></td>
            <td class="TableHeaderOverview"><%=m.getString("productOverview.Image") %></td>
            <td class="TableHeaderOverview"><%=m.getString("productOverview.description") %></td>
            <td class="TableHeaderOverview"><%=m.getString("productOverview.status") %></td>
 </tr>
<tr>
            <td><input type="text" name="newName" id="newProductName" /></td>
            <td><div id="uploadimage"></div>
            <div id="btn0" class="browse" dojoType="dojox.form.FileUploader" degradable="true" force="html" uploadOnChange="true" uploadUrl="/FileUploadServlet" ><%=m.getString("Choose") %>...</div></td>
            <td><input type="text" name="newDesc" id="newProductDescription"/></td>
            <td><a href="#" onclick="SaveNewProduct()"><%=m.getString("Save") %></a></td>
        </tr>
</table>
</form>

As noted in the comment were I try to make sure Flash isn't used, most of my clients don't have Flash so I have to make sure this works in IE9 even without flash.

comment:4 Changed 9 years ago by noddie

I should perhaps also note that I am testing this in the IE9 RC. Also my application has loads of xhrGet/xhrPost without problems in IE9, so I believe that problem is resolved in any case.

comment:5 Changed 9 years ago by Mike Wilcox

Your code doesn't look much different than what's in the existing test file. What version of IE are you using? Mine is: 9.0.7930.16406

comment:6 Changed 9 years ago by noddie

IE version is 9.0.8080.16413

comment:7 Changed 9 years ago by Mike Wilcox

Resolution: fixed
Status: newclosed

(In [23826]) Fixes #12308 Refs #12273 - fixed html ie9 upload bug.

comment:8 Changed 9 years ago by Mike Wilcox

Turns out I was out of date on dojo.io.iframe. I implemented your suggestion and it looks good. Thanks!

comment:9 Changed 9 years ago by bill

Component: GeneralDojoX Form
Milestone: tbd1.6

BTW there's no reason to write if(dojo.isIE && dojo.isIE < 9), if(dojo.isIE < 9 evaluates to the same thing (true for IE6,7,8 and false otherwise), and is shorter. The latter format is the intended usage in dojo. (Why does it work? Because dojo.isIE results to the IE version (6,7,8,9) on IE, and undefined otherwise.)

comment:10 Changed 8 years ago by Kenneth G. Franqueiro

Milestone: 1.61.5.2

Updating milestone to 1.5.2 to reflect inclusion in changeset [26956] for ticket #14199.

Note: See TracTickets for help on using tickets.