Tuesday, January 8, 2013

Jquery dropdown validation

Test for jQuery validate() plugin
*
*

*



Html Code here

<html xmlns="http://www.w3.org/1999/xhtml"><head>

<meta content="text/html; charset=ISO-8859-1" http-equiv="Content-Type">

<title>Test for jQuery validate() plugin</title>



<link href="css/screen.css" media="screen" type="text/css" rel="stylesheet">



<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>

<script type="text/javascript" src="http://jquery.bassistance.de/validate/lib/jquery.metadata.js"></script>

<script type="text/javascript" src="http://jzaefferer.github.com/jquery-validation/jquery.validate.js"></script>



<script type="text/javascript">

// only for demo purposes

$.validator.setDefaults({

submitHandler: function() {

alert("submitted!");

}

});


$.metadata.setType("attr", "validate");



$(document).ready(function() {


$("#selecttest").validate();

});

</script>



<style type="text/css">

.block { display: block; }

form.cmxform label.error { display: none; }

</style>



</head>

<body>





<div id="main">







<form id="selecttest" novalidate="novalidate">

<p>

<label for="cname">Name</label>

<em>*</em><input id="cname" name="name" size="25" class="required" minlength="2" />

</p>

<p>

<label for="cemail">E-Mail</label>

<em>*</em><input id="cemail" name="email" size="25" class="required email" />

</p>

<p>

<label for="curl">URL</label>

<em> </em><input id="curl" name="url" size="25" class="url" value="" />

</p>

<p>

<label for="ccomment">Your comment</label>

<em>*</em><textarea id="ccomment" name="comment" cols="22" class="required"></textarea>

</p>


<p>

<label for="jungle">Please select a jungle noun</label><br>

<select validate="required:true" title="Please select something!" name="jungle" id="jungle" class="error">

<option value=""></option>

<option value="1">Buga</option>

<option value="2">Baga</option>

<option value="3">Oi</option>

</select><label for="jungle" generated="true" class="error" style="display: inline;">Please select something!</label>

</p>








<p><input type="submit" value="Validate Selecttests"></p>

</form>







</div>









</body></html>
Posted by at
Labels:

No comments:

Post a Comment

Subscribe to: Post Comments (Atom)