Question

I am using a simple input box <input type="file" /> in a HTML form, and I want to enforce that only JPG, PNG, and GIF files can be uploaded.

How can I do this?

Answer 1

you can check this link, CodeProject: Image uploading

  $file = $("#yourFileuploadID");
                var $filePath = $.trim($file.val());
                if ($filePath == "") {
                    alert("Please browse a file to upload");
                    return;
                }

                var $ext = $filePath.split(".").pop().toLowerCase();
                var $allow = new Array("gif", "png", "jpg", "jpeg");
                if ($.inArray($ext, $allow) == -1) {
                    alert("Only image files are accepted, please browse a image file");
                    return;
                }

PS : It’s better to have server side validation, it will be handy when javascript is disabled at client side. make sure you check for both