Friday, May 8, 2015

Easy & Secure client side form validation using jquery validation plugin.

Jquery Validation Plugin:

This is very easy and secure method for client side form validation using validation plugin.

For this you have to include these three jquery validation libraries.

1. First
2. Second
3. Third

After this in your <script> you will add this:


<script>
    $(document).ready(function () {
        $('#myForm').validate({
            ignore: [],
            rules: {
                filename: {
                    required: true,
                    extension: 'docx|doc|gif|jpg|jpeg|png|pdf'                }
              },
            submitHandler: function(form) {
                $('#myForm')[0].submit();
                return false;
            }
        });
    });
</script>

<form method="post" action="/create2" id="myForm" enctype="multipart/form-data">
 <input type="file" name="filename" class="form-control"/>
 <label for="filename" class="error" style="display:none;color:red">This field is required</label> 
 <input type="submit" class="btn btn-primary" id="submit" name="submit" value="submit">
</form>

This will validate your file as required & its extension format.
 Also, you can add filesize in it according to your need.

Thanks

No comments:

Post a Comment