Solved

FileUpload Control with javascript

Posted on 2009-07-09
7
1,193 Views
Last Modified: 2012-05-07
Dear Friend,

i want to check the extension of the file when the user select the file by using the FileUpload control

i have javascript but i want it to call when the user select the file and after click on the open button.

so how can i call to javascript when the user select the file.

Thanks

0
Comment
Question by:virafh
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
7 Comments
 
LVL 22

Expert Comment

by:Ivo Stoykov
ID: 24811714
if(document.selectElementById('your_file_field_id).value.lastIndexOf('txt') < 0)
alert('not found')
else
alert('correct');
HTH
Ivo Stoykov
0
 
LVL 9

Expert Comment

by:Deathrace
ID: 24811721
i think this cannot be done with simple FILEUPLOAD control, you need to create a usercontrol which inhertis the fileupload control and perform client script actions.
0
 
LVL 20

Accepted Solution

by:
ddayx10 earned 500 total points
ID: 24811928
I'm not proud of it, but you can do this kind of thing (see snippet). Basically use the onclick event for FF and onpropertychange for IE. In conjunction they allow you access to the value when the "Open" button is clicked (which is exactly what you asked for).

I don't see the point though! I mean look the <input type="file" /> is supposed to be locked down for security reasons you just shouldn't be able to easily mess with it. Frankly I'm glad it is, or someone could cause grief.

So you have access to the file extension when the "Open" button is clicked. I don't see what this gains you over just checking the value when the upload button is clicked?! Even though you have the file extension when the "Open" button is clicked there is nothing you can do about it except inform them to select again (which you could have done with the other button for uploading anyway). In FF you can empty the value out, but in IE you cant (at least I dunno how) so ....what's the point? Maybe you have something in mind beyond where I'm thinking? Dunno, s'all right!


My fallback answer is "You can't do that! And you're not supposed to do that!
<input type="file" id="upFile" onclick="fileCheck();" onpropertychange="fileCheck();" />		
 
function fileCheck()
{
	var upfile = document.getElementById('upFile');
 
	if(upfile.value.length != 0)
	{
		var fileName = upfile.value.substring(upfile.value.lastIndexOf('\\')+1);
		var ext = fileName.substring(fileName.indexOf('.'));
		if(ext != '.png') //could be any extension, or checked in differnt way
		{ 
			//do something 
		}
	}
			
}

Open in new window

0
Technology Partners: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 

Author Comment

by:virafh
ID: 24812620
thankx ddayx10

your script is working
 now i just want to blank the fileUpload textbox

how can i ?
0
 

Author Closing Comment

by:virafh
ID: 31601481
Thank You :)
0
 

Author Comment

by:virafh
ID: 24812784
in firefox its not working

 onpropertychange="fileCheck();"

if you know the solution please let me know

thanks
0
 

Author Comment

by:virafh
ID: 24812840


buddy i solved it, instead of onpropertychange i using onchange


thankx all of you
0

Featured Post

Independent Software Vendors: We Want Your Opinion

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Exception Handling is in the core of any application that is able to dignify its name. In this article, I'll guide you through the process of writing a DRY (Don't Repeat Yourself) Exception Handling mechanism, using Aspect Oriented Programming.
The article shows the basic steps of integrating an HTML theme template into an ASP.NET MVC project
Finding and deleting duplicate (picture) files can be a time consuming task. My wife and I, our three kids and their families all share one dilemma: Managing our pictures. Between desktops, laptops, phones, tablets, and cameras; over the last decadeā€¦

730 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question