Building a Gmail Style File Uploading System using ASP.NET 2.0
page 4 of 7
by Jesudas Chinnathampi (Das)
Feedback
Average Rating: This article has not yet been rated.
Views (Total / Last 10 Days): 38347/ 751

How it works?

As you can see from the above code listing (Main.aspx), we have a hyperlink with a text of “Attach files.” The OnClick event for this hyperlink invokes a client side function, “Browse.” Within this browse function we are invoking the OnClick event for the <Input type=file> control (which resides in the Upload.aspx). Once this event is fired, the user will see the File Choose dialog box. After a file has been selected, the control will come back to the Browse function. The next statement that will be fired up will be ifUpload.btnSubmit.click(); this click event will end up executing the statements inside the SubmitForm function from Upload.aspx.  Once the form is submitted, you can use server side code to upload the file. Detailed coding for the Upload.aspx can be downloaded at the end of this article.

Since this technique will only work in the IE browser, you should make sure that the client’s browser is indeed Internet Explorer. I tested this in a Firefox browser and it did not work for sure.


View Entire Article

Article Feedback

Title:  
Name:  
Url: ( Optional )
Comment:  
Please add 2 and 1 and type the answer here:

User Comments

Title: bkjbjk   
Name: bkjbjkbjk
Date: 7/3/2008 9:12:35 PM
Comment:
bbjkbkj
Title: Good work!   
Name: Jane
Date: 6/25/2008 12:11:04 PM
Comment:
This is what I am looking for without using AJAX. Your code works very nice except:
frUpload should be ifu in
ifUpload = frUpload.document.form1
Title: Superb Code   
Name: Chaitanya
Date: 5/28/2008 11:36:42 PM
Comment:
hi
Jesudas,
Your code helps me a lot Thankyou for this superb code.

Regsrds
Chaitanya
Title: sdf   
Name: iuh
Date: 5/1/2008 11:03:23 AM
Comment:
iuh
Title: An Ajax Uploader works in firefox   
Name: prasad
Date: 4/21/2008 12:01:57 PM
Comment:
http://ajaxuploader.com/
Title: gfhf   
Name: fghfg
Date: 4/18/2008 11:22:42 AM
Comment:
fghf
Title: document.form1.myFile.click(); issue   
Name: prasad
Date: 4/14/2008 1:44:16 AM
Comment:
document.form1.myFile.click(); is well in IE but not in firefox.
Title: DirectoryNotFoundException was unhandled by user code   
Name: sree
Date: 1/10/2008 6:59:35 AM
Comment:
i am facing the problem when i click on the text file....
Title: Loophole   
Name: Chris Wilson
Date: 1/4/2008 11:58:41 AM
Comment:
Clever, but isn't this just exploiting something that is a loophole at best or a bug at worst? It seems to me that the behavior without an iframe is exactly what it should be given the input tag spec, and that the fact that it "works" if you wrap it in an iframe is really just an oversight that happens to only appear in IE. It's useful, yes, but it seems to me that it's essentially a bug implementing the HTML spec.
Title: nice   
Name: dude
Date: 1/4/2008 7:52:05 AM
Comment:
doesnt work in firefox
Title: Nice article but...   
Name: Jerome Vernon
Date: 1/3/2008 12:18:30 PM
Comment:
Nice article but have you looked at SWFUpload (http://swfupload.org/search/node/asp.net). It’s a javascript/flash multi-file uploader that works incredibly well. It’s free, works in IE/firefox, and they have an asp.net 2.0 sample web app in C# that can be downloaded from there site and run immediately. I have spent several months searching and reviewing various methods for selecting multiple files (hold ctl-key for selecting multiple files) for faster/easier uploading. You can stream the uploaded files to the file-system or database. SWFUpload is the best and easiest I’ve discovered so far.
Title: Thanks   
Name: josephshi
Date: 12/29/2007 1:46:48 AM
Comment:
These days i am thinking to have a new version file upload, your article is right on time. thanks a lot
Title: Error !!!   
Name: vish
Date: 12/24/2007 2:24:29 PM
Comment:
Hi,
Thanks but it does not work in firefox....
Title: Nice   
Name: Dinesh
Date: 12/24/2007 8:02:51 AM
Comment:
Thanks and nice a useful article
Title: Doesnt Work in Firefox   
Name: BoneKrusher
Date: 12/21/2007 6:55:31 PM
Comment:
Doesnt Work in Firefox
Title: Doesn't work in Opera 9.24 either   
Name: grizz
Date: 12/21/2007 7:48:47 AM
Comment:
it doesn't work in opera 9.24 either. attach file does not open any new window just reloads and "please select a file"
Title: Doesn't work in FF 2   
Name: Jko
Date: 12/21/2007 5:12:22 AM
Comment:
Doesn't work in FF 2
Title: Nice but   
Name: Michael
Date: 12/21/2007 12:21:00 AM
Comment:
Nice.
But, it didn't work with Firefox 2.0.0.11
Title: Nice   
Name: Sab
Date: 12/20/2007 12:46:12 AM
Comment:
Nice... keep up the good work
Title: Fileupload AJAX   
Name: Subgurim
Date: 12/19/2007 1:21:39 PM
Comment:
Already exists an opensource project that does this (and much more things): the FileUpload AJAX.

It's on codeplex (http://www.codeplex.com/fileuploadajax)
Title: Access is denied   
Name: Gilli
Date: 10/18/2007 3:02:31 AM
Comment:
U used the same code.
But when uploading the text document iam getting the error as access is denied.
How to solve the problem.
Title: Great Job   
Name: Tom
Date: 10/18/2007 1:53:56 AM
Comment:
U did a good job.
Thank You for providing this article.
It helps us a lot.Provide some more applications like this.
Title: Awsome!   
Name: ckang777
Date: 10/17/2007 11:20:34 PM
Comment:
Thank you so much for putting this solution up. You are awsome!

frUpload should be ifu in :

ifUpload = frUpload.document.form1

Thank a bunch!
Title: 11   
Name: 11
Date: 10/12/2007 11:19:22 PM
Comment:
nice article thanks
Title: Cancel Button Issue   
Name: Babar Javaid
Date: 10/3/2007 11:02:01 PM
Comment:
Nice article but the submit button onClick event occurs if I click the cancel button instead of the Open button in the File Browse Dialog box.
Title: Re:FF   
Name: Das
Date: 10/2/2007 4:02:44 AM
Comment:
It is not about invoking the click event for a hyperlink. Firefox does not allow the file choose dialog box to be displayed unless the user clicks the browse button
Title: FF   
Name: TweeZz
Date: 10/2/2007 1:30:13 AM
Comment:
What exactly is the issue in FF? If it is invoking a click on an anchor, then this probably can be solved using this code:
HTMLElement.prototype.click = function()
{
var evt = this.ownerDocument.createEvent('MouseEvents');
evt.initMouseEvent('click', true, true, this.ownerDocument.defaultView, 1, 0, 0, 0, 0, false, false, false, false, 0, null);
this.dispatchEvent(evt);
}

Product Spotlight
Product Spotlight 
Learn More
.NET Tools
asp.net shopping cart
asp.net chart control






Ads Powered by Lake Quincy Media
Community Advice: ASP | SQL | XML | Regular Expressions | Windows


©Copyright 1998-2008 ASPAlliance.com  |  Page Processed at 7/5/2008 1:29:09 PM  AspAlliance Recent Articles RSS Feed
About ASPAlliance | Newsgroups | Advertise | Authors | Email Lists | Feedback | Link To Us | Privacy | Search