How to check input file is empty, and also display an alert if png format is selected using jquery

Question

I have got an input file upload , need to check which file is uploaded / if no file is selected by the client using jquery.

<input type="file" name="files" id="file1" style="color:White" />
<input type="submit" value="Create" />

The check should trigger when submit is clicked.

Answer 1

See the sample I have created:

http://jsfiddle.net/G7xke/

---

<form>
<input type="file" name="files" id="file1" style="color:White" />
<input type="submit" value="Create" />
</form>
<button value="check" id="check" name="check" >check</button>

And JavaScript:

$("#check").click(function(){
    var fileName = $("#file1").val();
    if(fileName.lastIndexOf("png")===fileName.length-3)
        alert("OK");
    else
        alert("Not PNG");
})