In this article I will explain with an example, how to make FileUpload control accept only Image file in ASP.Net.
The accept attribute is a new attribute available in HTML5.
Note: Note: Accept Attribute does not restrict user from uploading invalid file.
 
 

HTML Markup

The HTML Markup consists of:
FileUpload – For selecting file.
The FileUpload control has been set with the following attribute.
accept – This attribute allows user to select only specified type of files from the Choose File dialog box.
Note: Accepting all files is default behavior and hence even if the accept attribute is not specified, by default, it will accept all files.
 
For example, in the following code, the FileUpload control will only allow user to select Image file i.e. file with extensions jpg, jpeg, png and gif.
<asp:FileUpload runat="server" accept=".jpg, .jpeg, .png, .gif" />
 
 

DO NOT use the accept attribute for validation

The accept attribute does not restrict user from uploading invalid files.
FileUpload Control accept only Image file in ASP.Net
 
And hence, if you want to restrict user and perform validation then please refer the following articles
JavaScript: Filtering Files based on Extensions in ASP.Net FileUpload Control
jQuery: Filtering Files based on Extensions in ASP.Net FileUpload Control using jQuery
 
 

Screenshot

FileUpload Control accept only Image file in ASP.Net
 
 

Browser Compatibility

The above code has been tested in the following browsers.
Microsoft Edge   FireFox  Chrome  Safari  Opera
* All browser logos displayed above are property of their respective owners.
 
 

Demo

View Demo
 
 

Downloads

Download Code