Home/ Questions/Q 9025483
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-16T06:16:58+00:00

I’m trying to use jquery validation with a rule/message set and can’t seem to

  • 0

I’m trying to use jquery validation with a rule/message set and can’t seem to get it working. Relativeny new to JQuery, so apologies if it’s a basic question. I’m trying to use document.forms[0] instead of a form ID. It works with simple validation where the field has class=”required” but not if I try to introduce rules. Any help greatly appreciated. Here’s the code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 
                "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
  <script src="http://code.jquery.com/jquery-latest.js"></script>
  <script type="text/javascript" src="http://jzaefferer.github.com/jquery-        validation/jquery.validate.js"></script>
  <script>
  $(document).ready(function(){
    $(document.forms[0]).validate({
    rules: {
      cname: {
      required: true,
    }
    },
    messages: {
      cname: "Please enter a valid Name."
    },
  });
  });
  </script>

</head>
<body>


 <form class="cmxform" id="commentForm" method="get" action="">
 <fieldset>
   <legend>A simple comment form with submit validation and default messages</legend>
  <p>
     <label for="cname">Name</label>
     <em>*</em><input id="cname" name="name"/>
   </p>

   <p>
     <input class="submit" type="submit" value="Submit"/>
   </p>
 </fieldset>
 </form>
</body>
</html>
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Firstly, you can just target your form by its id, #commentForm. Secondly, the root cause of your problem was that you were improperly targeting the input field by its id attribute. However, the .validate() plugin is looking for the name attribute, which in your case, also happened to be "name". I’ve changed the value of the name attribute in my example below just to make it more clear.

    jQuery:

    $(document).ready(function(){
    $('#commentForm').validate({
        rules: {
           username: {
               required: true
           }
        },
        messages: {
           username: "Please enter a valid Name."
        }
    });
});

    HTML:

    <form class="cmxform" id="commentForm" method="get" action="">

    <input type="text" id="cname" name="username" />

    ....

    Working DEMO:

    http://jsfiddle.net/egdEn/

    See the online documentation for more info.

    • 0