Adding validation to upload form using jQuery validation plugin

Question

I've got a simple HTML file upload form. I'm using the jQuery validation plugin in other forms to check for required values and would like to use this in the file upload form to ensure the user has clicked the Browse . . . button first and selected a file. The relevant code is below which is based on how other forms are setup but this one isn't working like the others:

<script src="lib/jquery.js" type="text/javascript" charset="utf-8"></script>
    <script src="lib/jquery.validate.min.js" type="text/javascript" charset="utf-8"></script>
    <script src="lib/jquery.metadata.js" type="text/javascript" charset="utf-8"></script>

    <script type="text/javascript">
    $.metadata.setType("attr", "validate");

    $(document).ready(function(){
    $("#upload").validate();
    });
    </script>

<form enctype="multipart/form-data" action="fileupload.php" method="POST" id='upload'>
Choose a file to upload: <input name="new_file" type="file" validate = "required:true">
<label for = "new_file" class = "error">You must select a file first before you can upload</label>
<input type="submit" name="action" value="Upload">

</form>

Grateful if someone can point out what I'm doing wrong.

Many thanks, Steve

Chinmayee G · Accepted Answer · 2010-11-30 11:40:25Z

1

Try by putting your validation script inside document.ready method. i.e.

$(document).ready(function(){
    $.metadata.setType("attr", "validate");

    $(document).ready(function(){
         $("#upload").validate();
    });
});

working demo

answered Nov 30, 2010 at 11:40

Chinmayee G

8,1172 gold badges34 silver badges41 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Adding validation to upload form using jQuery validation plugin

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related