Validating Uploaded File Extensions Using Javascript

If you have a file upload in a form it is helpful to limit what formats you want to allow users to upload. This tutorial will show you how to do this using javascript. Please note that client side validation is useful, but can be easily bypassed. For safest results use both client and server side validation.

For this example we will create a function called checkExtension(). This function will check the extension of the file to ensure that it is a format that you want to allow. If it is an allowed format it will do nothing and if it isn’t it will alert the user then clear the file upload input. The allowedExtensions variable is where you will put a list of the extensions that you want to allow.

var allowedExtensions = {
  '.zip'  : 1,
  '.rar' :1
};

function checkExtension(filename) 
{
    var match = /\..+$/;
    var ext = filename.match(match);
    if (allowedExtensions[ext]) 
    {
    return true;
    } 
    else 
    {
    alert("File must be .zip or .rar!");
    //will clear the file input box.
    location.reload();
    return false;
    }
}

This is all that is required from javascript to enable the validation. All you need to do is create the html form and add the onchange event handler to make it call this function.

<form>
     <input type="file" name="file" onchange="checkExtension(this.value);"/>
</form>

Remember to also include server side validation to ensure you are fully protected.

Related Articles

Related Questions

Thinking of Switching from Windows to Arch for Gaming – Need Some Advice!

I'm considering making the jump from Windows to Arch Linux, primarily because I use my PC for gaming. I have a few questions: 1. How...

Help with Laravel Setup Error

I'm trying to set up Laravel following a tutorial on YouTube, but I'm hitting a snag. When I run the command "laravel new firstwebsite",...

How do I roll out BitLocker with a generic PIN for all devices?

Hey everyone, I'm in the middle of rolling out BitLocker to around 300-400 devices at my company. I've managed to set some configurations like...

1 COMMENT

LEAVE A REPLY

Please enter your comment!
Please enter your name here

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Latest Tools

Online Hash Generator – String to Hash Converter

Need to quickly generate a hash from a string? Whether you're verifying file integrity, securing data, or just experimenting with cryptographic tools, this simple...

Convert CSV To HTML Table

Need to quickly turn CSV data into an HTML table? Whether you're copying data from Excel, Google Sheets, or another spreadsheet, this tool makes...

Student Group Randomizer

Creating fair and balanced groups in the classroom can be time-consuming — especially when you're trying to avoid repetition, manage different skill levels, or...

Random Group Generator

Need to split a list of people, items, or ideas into random groups? Our free Random Group Generator makes it quick and easy. Whether...

Flip Text Upside Down – Free Online Tool

Ever wanted to flip your text upside down just for fun or to grab someone’s attention in a creative way? This free online Upside...

Raffle Ticket Generator

If you're running a fundraiser, charity draw, or local event and need raffle tickets fast, this free online tool lets you generate and print...

Latest Posts

Latest Questions