jQuery Validate not validating on form submit

Question

I'm facing some problems with jQuery Validate. I've already put the rules but when i'm submitting the form, nothing happens.

I'm using ASP.NET MVC 4 and Visual Studio 2010.

EDIT: Click here to see my entire code. I'm trying to post it here but i'm getting the following error: 403 Forbidden: IPS signature match. Below is part of my code with Andrei Dvoynos's suggestion. I'm getting the same error. Clicking on submit and the page being reloaded

@{
ViewBag.Title = "Index";
}
@section Teste1{
<script type="text/javascript">
        $(document).ready(function () {
        $("#moeda").maskMoney();
        $("#percent").maskMoney();
        $(":input").inputmask();
          $('#tel').focusout(function () {
            var phone, element;
            element = $(this);
            element.unmask();
            phone = element.val().replace(/\D/g, '');
            if (phone.length > 10) {
                element.inputmask({ "mask": "(99) 99999-999[9]" });
            } else {
                element.inputmask({ "mask": "(99) 9999-9999[9]" });
            }
          }).trigger('focusout');
//the code suggested by Andrei Dvoynos, i've tried but it's occurring the same.
        $("#form1").validate({
          rules: {
             cpf: { required: true, },
             cep: { required: true, },
             tel: { required: true, },
             email: { required: true, },
             cnpj: { required: true, },
          },
          highlight: function (element) {
            $(element).closest('.form-group').addClass('has-error');
          },
          unhighlight: function (element) {
            $(element).closest('.form-group').removeClass('has-error');
          },
          errorElement: 'span',
          errorClass: 'help-block'
        });            
    });
</script>
}
@using (@Html.BeginForm("", "", FormMethod.Post,
             new { id = "form1", name = "form1" }))
{
<fieldset>
    <legend>Sign In</legend>
    <div class="form-group" id="divCpf">
        <label for="cpf">CPF</label>
        <input data-inputmask="'mask': '999.999.999-99'" class="form-control" id="cpf" />
    </div>
    <div class="form-group" id="divCep">
        <label for="cep">CEP</label>
        <input data-inputmask="'mask' : '99999-999'" type="text" class="form-control" id="cep" placeholder="CEP" />
    </div>
    <div class="form-group" id="divTel">
        <label for="tel">Telefone</label>
        <input type="text" class="form-control" id="tel" placeholder="tel" />
    </div>
    <div class="form-group" id="email">
        <label for="email">Email</label>
        <input type="text" class="form-control" id="email" placeholder="Email" />
    </div>
    <div class="form-group" id="divcnpj">
        <label for="cnpj">CNPJ</label>
        <input data-inputmask="'mask' : '99.999.999/9999-99'" type="text" class="form-control" id="cnpj" placeholder="CNPJ" />
    </div>
    <div class="form-group">
        <label for="moeda">Moeda</label>
        <input type="text" id="moeda" data-allow-zero="true" class="form-control" />
    </div>
    <div class="form-group">
        <label for="Percent">Percent</label>
        <input type="text" id="percent" data-suffix="%" data-allow-zero="true" class="form-control" maxlength="7" />
    </div>
    <input type="submit" class="btn btn-default" value="Sign In" id="sign" />
</fieldset>
}

My tests (all unsuccessful):

1 - put the $("form").validate() into $(document).ready()

2 - put the required class on the fields.

jQuery Validate plugin version: 1.13.0

Answer 1

In addition to the fatal problem you fixed thanks to @Andrei, you also have one more fatal flaw. The name attribute is missing from your inputs.

• Every element must contain a unique name attribute. This is a requirement of the plugin because it's how it keeps track of every input.

• The name is the target for declaring rules inside of the rules option.

$("#form1").validate({
    rules: {    // <-  all rule declarations must be contained within 'rules' option
        cpf: {  // <-  this is the NAME attribute
            required: true,
        ....

DEMO: http://jsfiddle.net/3tLzh/

Answer 2

You're missing the rules property when calling the validate function, try something like this:

$("#form1").validate({
    rules: {
        cpf: { required: true, },
        cep: { required: true, },
        tel: { required: true, },
        email: { required: true, },
        cnpj: { required: true, },
    },
    highlight: function (element) {
            $(element).closest('.form-group').addClass('has-error');
        },
    unhighlight: function (element) {
        $(element).closest('.form-group').removeClass('has-error');
    },
    errorElement: 'span',
    errorClass: 'help-block'
    });