NewBoy
NewBoy

Reputation: 1144

Jquery css 'display:block' not work

I am attempting to create a simple validation function for my contact form. Click here At the moment, once details are submitted the form keeps display:none even when entries are incorrect. I have tried to target the form id Which doesn't seem to be working either.

below is a snippet of my function

 var form = $('#ajax-contact');
 var formMessages = $('#form-messages');



  form.validate();
  $(form).submit(function(e) {

      if ($('#ajax-contact').valid()) {

        $('#ajax-contact').validate({
            rules: {
              name: {
                rangelength: [2, 40],
              },
              email: {
                rangelength: [2, 40],
                email: true,
                required: true
              },
              errorClass: "error",
              highlight: function (input) {
                $(input).closet('.required').removeClass('has-success').addClass('has-error');
              }
            }
        })

      } else {
        $("#ajax-contact").css({'display:block'});
        console.log('not working');
      }
  })

Upvotes: 0

Views: 1458

Answers (2)

Guruprasad J Rao
Guruprasad J Rao

Reputation: 29683

.css should be used this way:

$("#ajax-contact").css('display','block');

and if you have multiple .css to be set then you can go with

$("#ajax-contact").css({'display':'block','position':'relative'});

Upvotes: 9

brroshan
brroshan

Reputation: 1650

Try css({display: "block"}) as it takes an object as options. Not an array

Upvotes: 0

Related Questions