How do I enable my submit button? WARNING: Messy code

Hi there,

I am currently building a contact form's client side validation using jQuery. I started this straight after I finished the jQuery Basics course to try and retain the knowledge a little, but the code is not great so please forgive me :P.

So basically I am trying to enable a form's submit button after all form fields have been entered correctly. Here is all of the code for the validation form:

/*************************
  CONTACT FORM VALIDATION
*/////////////////////////

// Check Length of Name and Message Fields
function checkLength() {
  if($(this).val().length < 1) {
    $(this).next().show();
  } else {
    $(this).next().hide();
  }
}

// Check if email is valid
function validateEmail(email) {
   var emailReg = /^([\w-\.]+@([\w-]+\.)+[\w-]{2,4})?$/;
   return emailReg.test(email);
}

$('#email').keyup(function() {
  if(validateEmail($('#email').val())) {
    $(this).next().hide();
  } else {
    $(this).next().show();
  }
});

// Length Check Calls
$('#name').keyup(checkLength);
$('#message').keyup(checkLength);
// $('#email').keyup(checkLength);

function checkIfHidden() {
  return $("#errorname").is(':hidden');
}

function enableSubmitEvent() {
  if(checkIfHidden()) {
    $('#submit').prop('disabled', false);
  } else {
    $('#submit').prop('disabled', true);
  }
}

enableSubmitEvent();

... and here is the snippet I am working on so far:

function checkIfHidden() {
  return $("#errorname").is(':hidden');
}

function enableSubmitEvent() {
  if(checkIfHidden()) {
    $('#submit').prop('disabled', false);
  } else {
    $('#submit').prop('disabled', true);
  }
}

enableSubmitEvent();

Basically what I am trying to say here is that if the #errorname id (which is just an error message span I have created in the HTML) is hidden, return true and make the submit button false (which makes it clickable) and if not make the button true.

Incase you are wondering why I haven't included both the email and message field on the return statement in the checkIfHidden() function, it was just because I wanted to test the #errorname first, so it seemed pretty pointless to add them in too if I can't get past the first part.

I have been stuck on this bug for so long and I am unsure how to solve it (which actually leads onto my next question, does debugging JS/jQuery covered at the end of the Front End track?)

Please let me know where I am going wrong and how I should mitigate it. Or if I need to provide more information let me know.

I look forward to the answers!

Thanks, James.