开发者

How to restrict file type in FileUpload control

开发者 https://www.devze.com 2022-12-29 15:17 出处:网络
Is it possible to allow the fileupload control to show only images? When we click the 开发者_JS百科Browse button it should show only images.In 2015, web browsers support the input accept attribute, s

Is it possible to allow the fileupload control to show only images?

When we click the 开发者_JS百科Browse button it should show only images.


In 2015, web browsers support the input accept attribute, so you can do this:

<asp:FileUpload ID="fileUploader" runat="server" accept=".png,.jpg,.jpeg,.gif" />

Keep in mind Visual Studio may show you a message about this as an invalid attribute of the FileUpload ASP tool, however.


I found no direct solution for this problem.

This is my workaround using the RegularExpressionValidator:

<asp:FileUpload ID="fuImportImage" runat="server" />
<asp:RegularExpressionValidator ID="regexValidator" runat="server"
     ControlToValidate="fuImportImage"
     ErrorMessage="Only JPEG images are allowed" 
     ValidationExpression="(.*\.([Jj][Pp][Gg])|.*\.([Jj][Pp][Ee][Gg])$)">
</asp:RegularExpressionValidator>


You cannot strictly restrict the file type, but if the browser supports it you can cause it to initially show just a certain type of file:

<form method="post" action="blahblah.blah">
  <input type="file" name="image" id="image" accept="image/png, image/jpeg" />
</form>


No, in web you can't from client side, evidently from server side you can do amazing things. For this kind of thing, programmers normally use Activex, flash or the like.


//VALIDATE FILE EXTENTION
var _validFileFlag;
function fValidFileExt(vfilePath){
  var vFileName=vfilePath.split('\\').pop();
  var vFileExt=vfileName.split('.').pop();
  if(vFileExt.toUpperCase()=="JPEG" || vFileExt.toUpperCase()=="JPG"){
     _validFileFlag = true;
  } 
  _validFileFlag = false;
} 

<asp:FileUpload ID="FileUpload1" onchange="fValidFileExt(this.value);" runat="server"  />

Check '_validFileFlag' while saving data/upload..


Use accept attribute to show only images in file browser like below -

<asp:FileUpload ID="FileUploadFileType" runat="server" CssClass="form-control" accept=".png,.jpg,.jpeg,.gif" />

with asp.nets RegularExpressionValidator to validate selected file type with validation message.

<asp:RegularExpressionValidator ID="RegExValFileUploadFileType" runat="server"
                        ControlToValidate="FileUploadFileType"
                        ErrorMessage="Only .jpg,.png,.jpeg,.gif Files are allowed" Font-Bold="True"
                        Font-Size="Medium"
                        ValidationExpression="(.*?)\.(jpg|jpeg|png|gif|JPG|JPEG|PNG|GIF)$"></asp:RegularExpressionValidator>


Assuming you mean uploading images only.

You can check the ContentType property of the file (I.e. image/gif).

Take a look here for an example: https://web.archive.org/web/20100306030822/http://www.15seconds.com/issue/061116.htm


With plain <input type="file">, I am afraid it's not possible on the client-side.

However, some 3rd party uploader such as SWFUpload provides this functionality.

0

精彩评论

暂无评论...
验证码 换一张
取 消

关注公众号