I simply can't figure this out - file uploads with iframes... please help!

P

pbd22

hi.

i have been posting this here and elsewhere a lot and can't seem to get
resolution on this problem.
i have been trying to upload files using a hidden iframe to a
asp.net/vb.net form. the problem is that
the server code can't read the httpfilecollection. the count is always
zero.

my upload form's form tag looks like this:

<form id="uploadForm" method="post" enctype="multipart/form-data"
action="progress.aspx" onsubmit="return callToServer(this.id)">

when i remove the iframe method (callToServer), i am able to read the
uploaded files on the server side, but i want to send the files via
iframe, not by posting my upload form.

the pertanant loop in my server code is below ("myfiles.Count - 1" is
always "0 - 1"):

myfiles = HttpContext.Current.Request.Files
Dim iFile As Integer
For iFile = 0 To myfiles.Count - 1
Dim postedFile As HttpPostedFile = myfiles(iFile)
[ETC]
Next iFile

please, please help.
thanks.
 
P

pbd22

Hi Milosz,

thank you for your reply and sorry for the slow response (holidays).
while there are some subtle differences between your code and what
i have, the code is similar enough for me to still be confused as to
what i am doing wrong. i am starting to think that there might be
something wrong with the code in my client-side iframe javascript
although the IE debugger seems happy.

below is my iframe method(s). It comes from the engineers at apple
computer and you can find the link and blow-by-blow explainations
here:

http://developer.apple.com/internet/webcontent/iframe.html

If it is not obvious what is going wrong for me, i would REALLY
appreciate
it if somebody could look at my UploadClient.aspx and
UploadServer.aspx.vb
files? I know this is a tall call, but i am really stuck.

Thanks in advance.

the client code:

<script type="text/javascript">

var IFrameObj; // our IFrame object

function callToServer(theFormName) {

if (!document.createElement) {
return true
};

var IFrameDoc;

var URL = 'set_progress.aspx' + buildQueryString(theFormName);

if (!IFrameObj && document.createElement) { //1
// create the IFrame and assign a reference to the
// object to our global variable IFrameObj.
// this will only happen the first time
// callToServer() is called
try { //2
var tempIFrame=document.createElement('iframe');
tempIFrame.setAttribute('id','RSIFrame');
tempIFrame.style.border='0px';
tempIFrame.style.width='0px';
tempIFrame.style.height='0px';
IFrameObj = document.body.appendChild(tempIFrame);

if (document.frames) { //3
// this is for IE5 Mac, because it will only
// allow access to the document object
// of the IFrame if we access it through
// the document.frames array
IFrameObj = document.frames['RSIFrame'];
} // end 3
} // end 2
catch(exception) { // 3
// This is for IE5 PC, which does not allow dynamic creation
// and manipulation of an iframe object. Instead, we'll fake
// it up by creating our own objects.
iframeHTML='\<iframe id="RSIFrame" style="';
iframeHTML+='border:0px;';
iframeHTML+='width:0px;';
iframeHTML+='height:0px;';
iframeHTML+='"><\/iframe>';
document.body.innerHTML+=iframeHTML;
IFrameObj = new Object();
IFrameObj.document = new Object();
IFrameObj.document.location = new Object();
IFrameObj.document.location.iframe =
document.getElementById('RSIFrame');
IFrameObj.document.location.replace = function(location) { //4
alert(location);
this.iframe.src = location;
} // end 4
} // end 3
} // end 2

if ((navigator.userAgent.indexOf('Firefox') != -1) &&
(!IFrameObj.contentDocument)) {
// we have to give Firefox 1.5 a fraction of a second
// to recognize the new IFrame
setTimeout('callToServer("'+theFormName+'")',50);
return false;
}

if (navigator.userAgent.indexOf('Gecko') !=-1 &&
!IFrameObj.contentDocument) {
// we have to give NS6 a fraction of a second
// to recognize the new IFrame
setTimeout('callToServer("'+theFormName+'")',10);
return false;
}
if (IFrameObj.contentDocument) {
// For NS6
IFrameDoc = IFrameObj.contentDocument;
} else if (IFrameObj.contentWindow) {
// For IE5.5 and IE6
IFrameDoc = IFrameObj.contentWindow.document;
} else if (IFrameObj.document) {
// For IE5
IFrameDoc = IFrameObj.document;
} else {
return true;
}


IFrameDoc.location.replace=URL;
return false;

}

function buildQueryString(theFormName) {

var theDIV = document.getElementById('uploadDIV');
var theInputs = theDIV.getElementsByTagName('input');

var qs = '';

for (e=0;e<theInputs.length;e++) {

if (theInputs[e].name!='') {
qs+=(qs=='')?'?':'&'
if (theInputs[e].value != ""){
qs+=theInputs[e].name+'='+escape(theInputs[e].value)
}
//alert("the input length is: "+theInputs.length+" and this one's
name is "+theInputs[e].name);
}
}
return qs
}

</script>

Milosz said:
Hi there,

I prepared a simple example to explain the concept of 'iframe upload',
Example consists of three files:
- Upload.aspx - main page with hidden iframe and some javascript
- empty.htm - an empty html file
- FileUpload.aspx - another empty file responsible for saving file on the
disk.
The concept is quite strait forward. We use iframe's document to dynamicaly
generate (via javasctipt) html form and a file upload:

-- begin Upload.aspx --
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Upload.aspx.cs"
Inherits="Upload" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>Untitled Page</title>
</head>
<body>
<form id="form1" runat="server">
<div>

<iframe name="uploader" src="empty.htm" width="0" height="0"></iframe>
<input type="button" onclick="browseForFile()" value="Upload"/>

<script language="javascript">
//<!--

function browseForFile()
{
uploader.document.write(
'<form action="FileUpload.aspx" method="post"
enctype="multipart/form-data">' +
'<input type="file" name="file" id="file"
onchange="parent.transferFile()"/>' +
'</form>');
uploader.document.close();
setTimeout('uploader.document.getElementById("file").click();', 0);
}

function transferFile()
{
uploader.document.forms[0].submit();
}

//-->
</script>

</div>
</form>
</body>
</html>

-- end upload.aspx --

The second aspx file has no html content, it just saves incoming files:

-- beging FileUpload.aspx c# code behind --
protected void Page_Load(object sender, EventArgs e)
{
for (int i = 0; i < Request.Files.Count; i++)
{
HttpPostedFile file = Request.Files;

string fileName = "c:\\temp\\photos\\" + Guid.NewGuid().ToString("N") +
System.IO.Path.GetExtension(file.FileName);
file.SaveAs(fileName);
}

Response.Write("<script language=\"javascript\">");
Response.Write("alert('done!')");
Response.Write("</script>");
}
-- end FileUpload.aspx --

hope this helps

--
Milosz Skalecki
MCAD


pbd22 said:
hi.

i have been posting this here and elsewhere a lot and can't seem to get
resolution on this problem.
i have been trying to upload files using a hidden iframe to a
asp.net/vb.net form. the problem is that
the server code can't read the httpfilecollection. the count is always
zero.

my upload form's form tag looks like this:

<form id="uploadForm" method="post" enctype="multipart/form-data"
action="progress.aspx" onsubmit="return callToServer(this.id)">

when i remove the iframe method (callToServer), i am able to read the
uploaded files on the server side, but i want to send the files via
iframe, not by posting my upload form.

the pertanant loop in my server code is below ("myfiles.Count - 1" is
always "0 - 1"):

myfiles = HttpContext.Current.Request.Files
Dim iFile As Integer
For iFile = 0 To myfiles.Count - 1
Dim postedFile As HttpPostedFile = myfiles(iFile)
[ETC]
Next iFile

please, please help.
thanks.
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Members online

No members online now.

Forum statistics

Threads
473,755
Messages
2,569,536
Members
45,013
Latest member
KatriceSwa

Latest Threads

Top