jquery input type file validation

Question

This is my html form. It contains jquery validation plugin. I am trying to validate my input field type file. When i will submit the form it should check user upload image or not.

<html>
<head>
<script src="http://code.jquery.com/jquery.min.js"></script>
<script src="http://code.jquery.com/ui/1.11.2/jquery-ui.min.js"></script>
<script type="text/javascript" src="<?php echo $this->config->base_url(); ?>r/js/jquery.validate.js"></script>
<script type="text/javascript" src="http://jqueryvalidation.org/files/dist/additional-methods.min.js"></script>
</head>

<body>
<form role="form" name="add_app_form">
<div class="upload-app-icon">
                    <span>Uplod your App icon here</span>
                    <div class="add-icon"><input type="file" name="app_icon" id="app_icon" ></div>

                </div>
<div class="submit-formbtn">
                    <input class="icon-btn" type="submit" value="Upload">
                </div>
</form>

When i submit my form jquery validation doesn't work. I am using this javascript but it is not working

<script type="text/javascript">

    $.validator.addMethod("notEqual", function(value, element, param) {
        return this.optional(element) || value != param;
    });


        $("#add_app_form").validate({

            rules: {
                 app_icon:{
                         required: true,
                         extension: "xls|csv"   
                    } 
            },
            messages: {

                app_icon: "Add icon"
            },
            tooltip_options: {

                app_icon: {placement:'top',html:true}
            }
        });

</script>

mhodges mhodges · Accepted Answer · 2016-01-13T19:46:30

Limit file types on the element itself using accept attribute for the 99.9% of use cases. http://www.w3schools.com/tags/att_input_accept.asp

However, as it points out, don't use this for validation/security purposes. All file type/content validation should be done on the server side.

jquery input type file validation

1 Answers