Validate Extension (jQuery)

Question

<input type="file" id="css-file" />
<input type="text" id="css-url" value="eg. http://domain.com/style.css" />

I need both the fields to accept only .css files. Can I validate without having to use a validation plugin just for these 2 fields?

If anything other than .css is detected, it should give an alert()

Thanks!

Answer 1

Just make sure that the value matches /.css$/.

Answer 2

You can check th extension of both with a regex or .slice() on the value, like this:

​$("form").submit(function(e) {
    $("#css-file, #css-url").each(function() {
        if(this.value.slice(-4) != ".css") {
            e.preventDefault();
            alert(this.value + " is not a .css file");
        }
    });
});​

You can give it a try here.