Solved

FileUpload Control with javascript

Posted on 2009-07-09
7
1,191 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
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
DevOps Toolchain Recommendations

Read this Gartner Research Note and discover how your IT organization can automate and optimize DevOps processes using a toolchain architecture.

 

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

What is SQL Server and how does it work?

The purpose of this paper is to provide you background on SQL Server. It’s your self-study guide for learning fundamentals. It includes both the history of SQL and its technical basics. Concepts and definitions will form the solid foundation of your future DBA expertise.

Question has a verified solution.

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

Suggested Solutions

IntroductionWhile developing web applications, a single page might contain many regions and each region might contain many number of controls with the capability to perform  postback. Many times you might need to perform some action on an ASP.NET po…
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.
This tutorial gives a high-level tour of the interface of Marketo (a marketing automation tool to help businesses track and engage prospective customers and drive them to purchase). You will see the main areas including Marketing Activities, Design …
This video shows how to use Hyena, from SystemTools Software, to bulk import 100 user accounts from an external text file. View in 1080p for best video quality.

803 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