Validate File Extension in ASP.NET Using JavaScript

This article shows how to validate a file extension in ASP.NET using JavaScript. In this article, we create a JavaScript function to ensure that only the specified extension is valid. All you need to do is implement and hook it up to your code. First of all you start Visual Studio .NET and make a new ASP.NET web site using Visual Studio 2010.

So to make it work use the following JavaScript function code in your page:

<script type="text/javascript">

        function validate() {

            debugger;

            var array = ['pdf', 'doc', 'docx', 'txt', 'xlsx', 'ppt', 'zip'];

           var xyz=  document.getElementById("FileUpload1");

            var Extension = xyz.value.substring(xyz.value.lastIndexOf('.') + 1).toLowerCase();

            if (array.indexOf(Extension) <= -1) {

                alert("Please Upload only pdf,doc,zip,txt.xlsx and ppt extension flle");

                return false;

            }

        }

    </script>

 Now drag and drop a FileUpload and a Button Control onto the form such that you have:

<asp:FileUpload ID="FileUpload1" runat="server" />

        <br />

        <br />

    </div>

<asp:Button ID="Button1" runat="server" Text="Button" OnClientClick="return validate();" />

Now call the JavaScript function with the Button OnClientClick event as in the following:

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="CheckExtention.aspx.cs"

    Inherits="WebApplication2.CheckExtention" %>

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">

    <title></title>

    <script type="text/javascript">

        function validate() {          

            var array = ['pdf', 'doc', 'docx', 'txt', 'xlsx', 'ppt', 'zip'];

           var xyz=  document.getElementById("FileUpload1");

            var Extension = xyz.value.substring(xyz.value.lastIndexOf('.') + 1).toLowerCase();

            if (array.indexOf(Extension) <= -1) {

                alert("Please Upload only pdf,doc,zip,txt.xlsx and ppt extension flle");

                return false;

            }

        }

    </script>

</head>

<body>

    <form id="form1" runat="server">

    <div>

        <asp:FileUpload ID="FileUpload1" runat="server" />

        <br />

        <br />

    </div>

    <asp:Button ID="Button1" runat="server" Text="Button" OnClientClick="return validate();" />

    </form>

</body>

</html>

 

Now run it and upload a file with the Upload control and click on the control to validate the file.

 

File-validation-in-javascript.jpg


Up Next
    Ebook Download
    View all
    Learn
    View all