jQuery validation form not working

Question

MY .js file:

 //rounded corners
        $(document).ready(function() {
            $("#topbar").corner("bl br 5px");
            $("#mainbar").corner("5px");
            $("#sidebar").corner("5px");
            $("#bottombar").corner("5px");
        });
    //form
        $(document).ready(function(){
            $("#commentForm").validate({
                rules: {
                    FieldData0: {
                        required: true
                    },
                    FieldData1: {
                        required: true,
                        email: true
                    },
                    FieldData2: {
                        required: true
                    }
                },
                messages: {
                    FieldData0: {
                        required: "* Required"
                    },
                    FieldData1: {
                        required: "* Required",
                        minlength: "* 2 Characters Required."
                    }
                }   
            });
        })

My .html file:

<div id="mainbar">
        <form id="commentForm" method="post" action="http://www.emailmeform.com/fid.php?formid=254816"&gt;
        <h2>Contact Form</h2>
        <p>
            <label for="name">Your Name</label>
            <input type="text"  id="name" name="FieldData0" />
        </p>
        <p>
            <label for="email">Your Email</label>
            <input type="text"  id="email" name="FieldData1" />
        </p>
        <p>
            <label for="message">Your Message</label>
            <textarea type="text" id="message" name="FieldData2"></textarea>
        </p>
        <p>
            <input id="button" type="submit" value="Submit">
        </p>
        </form>
    </div>

live example:

http://weedcl.zxq.net/form.html

Answer 1

After looking at the demo I noticed that your jquery pluings are missing (at least in the html). Try adding:

<script type="text/javascript" src="http://ajax.microsoft.com/ajax/jquery.validate/1.6/jquery.validate.js" />

Before including custom.js in the head document. Form validation is provided via a plugin, not by jQuery itself.

Also, I noticed that the corner plugin is not present as well - download it and include it in the head.

You should probably do the same with the jQuery png fix.