CODEWITHSUNDEEP
jqueryjquery-pluginsjquery-validate
fvgs
fvgs

Reputation: 21982

Trouble getting jQuery Validation plugin to work

I'm new to jQuery and, although I understand the gist of how it works, I'm unable to figure out why the validation plugin isn't working on my form.

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script type="text/javascript" src="/validation/dist/jquery.validate.min.js"></script>
<script type=text/javascript">
    $(document).ready(function(){
    $("#signup").validate();
    });
</script>

Form Header:

<form action="/registration/" method="post" id="signup">

Furthermore, what are the recommended sources for getting the latest versions of both jQuery and the validate plugin?

Upvotes: 0

Views: 545

Answers (2)

J. Bruni
J. Bruni

Reputation: 20490

You need to specify rules for the validator. You also need to click the "submit" button to perform the validation. Alternatively, you may want to trigger the validation using the form function of the Validator object (which is not usually recommended).

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script type="text/javascript" src="jquery.validate.js"></script>

<script type=text/javascript">
    $(document).ready(function(){
        $("#signup").validate({rules: {'company': 'required'}}).form();
    });
</script>

<form action="/registration/" method="post" id="signup">
    Company: <input type="text" name="company" />
    <input type="submit" value="Save" />
</form>

Upvotes: 1

Barmar
Barmar

Reputation: 782498

The file you need to download is called 'jquery.validate.js'.

By default, the validation plugin uses the classes of the input fields for validation. So if you have an email field, use:

<input type="text" class="email" />

If a field is required, add required to the class, e.g.:

<input type="text" class="required" />

If it's a required email, combine them:

<input type="text" class="required email" />

It also understands HTML5 input types and attributes, so you could do:

<input type="email" required="required"/>

Upvotes: 1

Related Questions