FileUpload Control Validation

With FileUpload control you can receive files from your web application users. Often, you don't want to receive all file types, but only specific extensions (e.g. images only) depending of your application requirements. Unfortunately, FileUpload control still have not some Filter property like Open and Save File dialogs in .NET Windows Forms to limit file types. Because of that, you need to write some additional code to be sure that user will upload regular file type.

Let say you have two web controls on web form, on FileUpload Control to select a file and one button control

Because in ASP.NET we have client and server side, validation could be done on client and on server. You need to have server side validation because of security reasons, but you also need client side validation because it is faster and more user friendly. Let see how to implement both types, for example our web application will allow only upload of .xls or .xml files.

FileUpload Control client side validation

You can use CustomValidator to implement FileUpload validation on client side. Possible implementation could be with code like this:

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

&nbsp;<asp:Button ID="btnUpload" runat="server" Text="Upload" />

<br />

<asp:CustomValidator ID="CustomValidator1" runat="server"

 ClientValidationFunction="ValidateFileUpload" ErrorMessage="Please select valid .xls or .xml file"></asp:CustomValidator>

<script language="javascript" type="text/javascript">

    function ValidateFileUpload(Source, args) {

        var fuData = document.getElementById('<%= fuData.ClientID %>');

        var FileUploadPath = fuData.value;

        if (FileUploadPath == '') {

            // There is no file selected

            args.IsValid = false;

        }

        else {

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

            if (Extension == "xls" || Extension == "xml") {

                args.IsValid = true; // Valid file type

            }

            else {

                args.IsValid = false; // Not valid file type

            }

        }

    }

</script> 

If visitor tries to upload wrong file type or FileUpload have empty value, CustomValidator will return an error message.

FileUpload Control server side validation

Because of security reasons, you need to validate FileUpload control on server side too. You can use the same idea like for client side validation. In this case, just use OnServerValidate event, like in code bellow:

 protected void CustomValidator1_ServerValidate(object source, ServerValidateEventArgs args)
{
    // Get file name
    string UploadFileName = fuData.PostedFile.FileName;

    if(UploadFileName == "")
    {
      // There is no file selected
      args.IsValid = false;
    }
    else
    {
        string Extension = UploadFileName.Substring(UploadFileName.LastIndexOf('.') + 1).toLower();

        if (Extension == "xls" || Extension == "xml")
        {
          args.IsValid = true; // Valid file type
        }
        else
        {
          args.IsValid = false; // Not valid file type
        }
    }
}



Now is your FileUpload Control protected on client and server side. I hope you found this tutorial helpful