JQuery url validation
jQuery "required url" is the method to validate or check url if the element is empty (text input) or wrong url type entered .
jQuery "required url" is the method to validate or check url if the element is empty (text input) or wrong url type entered .jQuery url Validation :
jQuery "required url" is the method to validate or check url if the element is empty (text input) or wrong url type entered .We can validate our url in another type by writing the "url : true" in the rules tag. Like as in this example.
<script type="text/javascript">
$(document).ready(function() {
$("#commentForm").validate({
rules: {
field: {
required: true,
url : true
}
}
});
</script>
Getting Started with jQuery "required url" :
In this example there are the following steps which are used to make jQuery " required url". This example Makes "field" always required. Nothing, blanks and wrong url type are invalid.
Step 1: In the first step we make css to create the text field background, height, width and other things
cmxform.css :
form.cmxform {
width: 370px;
font-size: 1.0em;
color: #333;
}
form.cmxform legend {
padding-left: 0;
}
form.cmxform fieldset {
border: none;
border-top: 1px solid #C9DCA6;
background-color: #F8FDEF;
}
0form.cmxform label.error, label.error {
color: red;
font-style: bold
1}div.error { display: none; }input {border: 1px solid black; }
Step 2: In the second step we make the connection with jquery plugins which are jquery1.js , jquery.validate.js and connection with css page.
<link rel="stylesheet" type="text/css" media="screen" href="../../plugin/cmxform.css" />
2<script src="../../plugin/jquery1.js" type="text/javascript"></script>
<script src="../../plugin/jquery.validate.js" type="text/javascript"></script>
Step 3: In the third step we will make the HTML part, the HTML required for the front end for this text field .With the help of this text field we check that the required field should not be empty and it should not be wrong url type.
<html>
<body>
<form class="cmxform" id="commentForm" method="post" action="">
4<fieldset>
<p>
E-Mail:<input id="url" name="url" class="required url" />
5</p>
<p>
<input class="submit" type="submit" value="Submit"/>
6</p>
</fieldset>
</form>
7</body>
</html>
Step 4: In the last step we will make the jQuery part , the jQuery required for the checking the validation for specified text field .With the help of this jQuery we check that the required field should not be empty and validated field should be of the url type.
<script type="text/javascript">
$(document).ready(function() {
$("#commentForm").validate();
9});
</script>
After using the following steps the required text field will validated and we can check the validation by clicking on the submit button.
