Question

132

JQuery Validate Image Upload File Type

rated 0 times [ 135] [ 3] / answers: 1 / hits: 30234 / 11 Years ago, mon, january 6, 2014, 12:00:00

I have a JQuery script that validates the upload of avatar images but I need it to prevent the upload of anything other than PNG, JPG & GIF images. Any way of implementing this into the code I have? Here is the code:

$('#addButton').click(function () {

    var avatar = $(#avatarupload).val();

    if(avatar.length < 1) {

        avatarok = 0;

    }

    //ELSE IF FILE TYPE

    else {

        avatarok = 1;

    }

    if(avatarok == 1) {

        $('.formValidation').addClass(sending);

        $(#form).submit();

    }

    else {

        $('.formValidation').addClass(validationError);

    }

    return false;

});

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

jeffn

Add To Favorites

Follow

Total Points: 559

Total Questions: 81

Total Answers: 103

Location: Spain

Member since Thu, Dec 23, 2021

2 Years ago

answered 11 Years ago bryantc · Accepted Answer

This should check the file extension

var extension = avatar.split('.').pop().toUpperCase();

if (extension!=PNG && extension!=JPG && extension!=GIF && extension!=JPEG){

    avatarok = 0;

}

So the full code should looks like

$('#addButton').click(function () {

    var avatar = $(#avatarupload).val();

    var extension = avatar.split('.').pop().toUpperCase();

    if(avatar.length < 1) {

        avatarok = 0;

    }

    else if (extension!=PNG && extension!=JPG && extension!=GIF && extension!=JPEG){

        avatarok = 0;

        alert(invalid extension +extension);

    }

    else {

        avatarok = 1;

    }

    if(avatarok == 1) {

        $('.formValidation').addClass(sending);

        $(#form).submit();

    }

    else {

        $('.formValidation').addClass(validationError);

    }

    return false;

});