CODEWITHSUNDEEP
jqueryvalidation
Jess McKenzie
Jess McKenzie

Reputation: 8385

jQuery: Using Validation Query

I am looking at the following source in the jQuery Documentation. You can see where it says field: do I set it to the specific field like this field:('#fieldname');

<!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 type="text/javascript">
jQuery.validator.setDefaults({
    debug: true,
    success: "valid"
});;
</script>

  <script>
  $(document).ready(function(){
    $("#myform").validate({
  rules: {
    field: {
      required: true,
      url: true
    }
  }
});
  });
  </script>
  <style>#field { margin-left: .5em; float: left; }
    #field, label { float: left; font-family: Arial, Helvetica, sans-serif; font-size: small; }
    br { clear: both; }
    input { border: 1px solid black; margin-bottom: .5em;  }
    input.error { border: 1px solid red; }
    label.error {
        background: url('http://dev.jquery.com/view/trunk/plugins/validate/demo/images/unchecked.gif') no-repeat;
        padding-left: 16px;
        margin-left: .3em;
    }
    label.valid {
        background: url('http://dev.jquery.com/view/trunk/plugins/validate/demo/images/checked.gif') no-repeat;
        display: block;
        width: 16px;
        height: 16px;
    }
</style>
</head>
<body>

<form id="myform">
  <label for="field">Required, URL: </label>
  <input class="left" id="field" name="field" />
  <br/>
  <input type="submit" value="Validate!" />
</form>

</body>
</html>

Upvotes: 0

Views: 402

Answers (1)

Erikk Ross
Erikk Ross

Reputation: 2183

The field is a reference to the name of the page element that you want to validate. In your case, the name of the page element that you are validating is called "field": 

<input class="left" id="field" name="field" />

If it had a different name then you would use that name in your code.

For example if you had another form field named first_name: 

<input class="left" id="first_name" name="first_name" />

The jQuery code to validate both the "field" and "first_name" text boxes would be this: 

<script>
  $(document).ready(function(){
    $("#myform").validate({
      rules: {
       field: {
         required: true,
         url: true
       }, 
       first_name: {
         required: true
       }
     }
   });
  });
 </script>

Upvotes: 1

Related Questions