.NET Framework Bookmark and Share   
 index > JScript for the .NET Framework > Image file size and content type validation in javascript
 

Image file size and content type validation in javascript

Hi,

I need to do image file validation in javascript...

I am using asp.net file upload control to select an image file....here i want to validate selected image file ( i.e., image file extension,size in bytes,content type) at client side using javascript.
I have validated image file name extension (Ex : .jpg,jpeg etc),but I didn't find any solution to validate its size and content type in javascript.

Note: I can validate size using ActiveX object, but I am not going for that b'coz of browser issues.

I have tried the same in different way using Ajax.I wrote a method (Image validation method), which takes fileupload control object as its parameter,in codebehind file and tried to call this method from clent side using ajax.But I am unable to invoke that server side method by passing fileupload object from clentside method.

Can you please provide the solution either using javascript or ajax....

Thanks in advance.

Regards
Lavanya
Lavanya.R

Hi Lavanya,


Check this script, it may be sufficient for your requirement.


functionload_image()

{

varimgpath = document.getElementById('fupImage').value;

if(imgpath !="")

{

// code to get File Extension..

vararr1 =newArray;

arr1 = imgpath.split("\\");

varlen = arr1.length;

varimg1 = arr1[len-1];

varfilext = img1.substring(img1.lastIndexOf(".")+1);

// Checking Extension

if(filext =="jpg"|| filext =="jpeg"|| filext =="gif"|| filext =="bmp")

document.getElementById('imgUser').src = imgpath;

else

{

alert("Invalid File Format Selected");

document.getElementById('fupImage').value ="";

returnfalse;

}

}

}


potta vijay kumar
potta vijay kumar

Hi Lavanya,


Check this script, it may be sufficient for your requirement.


functionload_image()

{

varimgpath = document.getElementById('fupImage').value;

if(imgpath !="")

{

// code to get File Extension..

vararr1 =newArray;

arr1 = imgpath.split("\\");

varlen = arr1.length;

varimg1 = arr1[len-1];

varfilext = img1.substring(img1.lastIndexOf(".")+1);

// Checking Extension

if(filext =="jpg"|| filext =="jpeg"|| filext =="gif"|| filext =="bmp")

document.getElementById('imgUser').src = imgpath;

else

{

alert("Invalid File Format Selected");

document.getElementById('fupImage').value ="";

returnfalse;

}

}

}


potta vijay kumar
potta vijay kumar
Hi there

The reply above is excellent.

My personal solution was to use:

	// get the file name; extract the name part only; check for valid extensions 
	cv_name = document.getElementById('cv-name').value; 
	cv_name = encodeURI(cv_name);
	cv_name = cv_name.toLowerCase();
	cv_name = cv_name.split("%5c");
	cv_name_length = cv_name.length - 1;
	cv_name = cv_name[cv_name_length];
	cv_name = decodeURI(cv_name);
			
	cv_name_check = cv_name.split(".");
	cv_name_check_length = cv_name_check.length - 1;
			
	if (cv_name_check[cv_name_check_length] == "doc" || cv_name_check[cv_name_check_length] == "txt" || cv_name_check[cv_name_check_length] == "pdf")
	{
		document.getElementById('upload-cv-name').value = cv_name
	}
	else
	{
		alert('Sorry, we can only accept CVs in .DOC, .TXT or .PDF format. Please try a different file.')
				
		// reset cv_name
		cv_name = 'null'
	}
But.............the solution recommended above is better!

Andrew
Andrew-BKK

You can use google to search for other answers

Custom Search

More Threads

• Type mismatch error
• get value from gridview
• Breakpoint will not currently be hit...
• Microsoft jscript runtime error: Automation server can't create object
• unload event
• Accessing C# classes from IE (JScript)
• Hebrew Parameters in Query String
• How to Disply image in HTML from from SQL server
• how to display Time on page in asp.net 2.0 without using AJAX Control.
• How to access Element from page loaded inside Iframe, where My page is containing that iframe Tag...Please Help