Pass deeply nested element to function in JQuery

Posted by klez on Stack Overflow See other posts from Stack Overflow or by klez
Published on 2010-05-07T23:56:28Z Indexed on 2010/05/08 0:38 UTC
Read the original article Hit count: 279

Filed under:

I have this form:

<form action="contact.php" method="post" id="contactform">
          <ol>
            <li>
              <label for="name">First Name * </label>
              <input id="name" name="name" class="text" />
            </li>
            <li>
              <label for="email">Your email * </label>
              <input id="email" name="email" class="text" />
            </li>
            <li>
              <label for="company">Company</label>
              <input id="company" name="company" class="text" />
            </li>
            <li>
              <label for="subject">Subject</label>
              <input id="subject" name="subject" class="text" />
            </li>
            <li>
              <label for="message">Message * </label>
              <textarea id="message" name="message" rows="6" cols="50"></textarea>
            </li>

            <li class="buttons">
              <input type="image" name="imageField" id="imageField" src="images/send.gif" />
            </li>
          </ol>
        </form>

This javascript function that does some basic validation:

function validateRequired(field,alerttxt) {
    with (field) {
        if (value==null||value=="") {
            alert(alerttxt);
            return false;
        }
        return true;
    }
}

And this script (written with jquery) to intercept the submit event

jQuery(document).ready(function(){
    $('#contactform').submit(function(){
        ...
    });
});

The problem is that, inside the last script I want to call validateRequired passing each required input/textarea (namely: name, email and message) as first parameter.

I tried like this:

validateRequired($('#name'));

but it doesn't work.

How can I do this?

© Stack Overflow or respective owner

Related posts about jQuery