PDA

View Full Version : [CLOSED][3.0.3] It's not possible upload file in Opera



Pavel Benes
4 Dec 2009, 2:10 AM
Ext version tested:

Ext 3.0 rev 3


Adapter used:

ext


css used:

only default ext-all.css


Browser versions tested against:

Opera 10.10


Operating System:

Windows 7
Mac OS X 10.5.8


Description:

It's not possible upload file in Opera
related thread: http://www.extjs.com/forum/showthread.php?t=76229


Test Case:



Ext.onReady(function() {
var form = new Ext.form.FormPanel({
renderTo: Ext.getBody(),
url: 'mockup-target.html',
fileUpload: true,
buttons: [
{
text: 'Submit',
handler: function() {
form.getForm().submit({
waitMsg: 'File is being uploaded...',
success: function(form, action) {
alert('Success: "' + action.result.file + '"');
},
failure: function(form, action) {
alert('Failure: ' + action.response.responseText);
},
scope: this
});
}
}
],
items: [
{
xtype: 'component',
autoEl: {
name: 'file',
tag: 'input',
type: 'file'
}
}
]
});
});

mockup-target.html:
<html><body>{"success":true,file:"albert.jpg"}</body></html>



Steps to reproduce the problem:

open test case in Opera
upload any file


The result that was expected:

File will be uploaded
Message with text: 'Success: "albert.jpg"'


The result that occurs instead:

ulpoad freezes


Possible fix:

Opera throws event load before sending of hidden frame. First event doesn't contain any text, so we can filter it.




Ext.override(Ext.data.Connection, {
// private
doFormUpload : function(o, ps, url){
var id = Ext.id(),
doc = document,
frame = doc.createElement('iframe'),
form = Ext.getDom(o.form),
hiddens = [],
hd,
encoding = 'multipart/form-data',
buf = {
target: form.target,
method: form.method,
encoding: form.encoding,
enctype: form.enctype,
action: form.action
};

Ext.fly(frame).set({
id: id,
name: id,
cls: 'x-hidden',
src: Ext.SSL_SECURE_URL // for IE
});
doc.body.appendChild(frame);

// This is required so that IE doesn't pop the response up in a new window.
if(Ext.isIE){
document.frames[id].name = id;
}

Ext.fly(form).set({
target: id,
method: 'post',
enctype: encoding,
encoding: encoding,
action: url || buf.action
});

// add dynamic params
Ext.iterate(Ext.urlDecode(ps, false), function(k, v){
hd = doc.createElement('input');
Ext.fly(hd).set({
type: 'hidden',
value: v,
name: k
});
form.appendChild(hd);
hiddens.push(hd);
});

function cb(){
var me = this,
// bogus response object
r = {responseText : '',
responseXML : null,
argument : o.argument},
doc,
firstChild;

try{
doc = frame.contentWindow.document || frame.contentDocument || WINDOW.frames[id].document;
if(doc){
if(doc.body){
if(/textarea/i.test((firstChild = doc.body.firstChild || {}).tagName)){ // json response wrapped in textarea
r.responseText = firstChild.value;
}else{
r.responseText = doc.body.innerHTML;
}
}
//in IE the document may still have a body even if returns XML.
r.responseXML = doc.XMLDocument || doc;
}
}
catch(e) {}

if (r.responseText.length === 0) {
return;
}

Ext.EventManager.removeListener(frame, 'load', cb, me);

me.fireEvent("requestcomplete", me, r, o);

function runCallback(fn, scope, args){
if(Ext.isFunction(fn)){
fn.apply(scope, args);
}
}

runCallback(o.success, o.scope, [r, o]);
runCallback(o.callback, o.scope, [o, true, r]);

if(!me.debugUploads){
setTimeout(function(){Ext.removeNode(frame);}, 100);
}
}

Ext.EventManager.on(frame, 'load', cb, this);
form.submit();

Ext.fly(form).set(buf);
Ext.each(hiddens, function(h) {
Ext.removeNode(h);
});
}
});

Condor
4 Dec 2009, 4:06 AM
Duplicate of this post (http://www.extjs.com/forum/showthread.php?p=390215#post390215) (fix included).

mystix
4 Dec 2009, 8:00 AM
marking this report [CLOSED] since it's a duplicate of an existing report.