I am very new to web development share your ideas here . tell me How to validate each tab in jquery ui tabs
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>jQuery UI Tabs - Default functionality</title>
<link rel="stylesheet" href="
http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
<script src="
http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="
http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<link rel="stylesheet" href="/resources/demos/style.css" />
<meta name="viewport" content="width=620,Initial-Scale=1.0">
<script type="text/javascript">
$(document) .ready(function() {
$.validate();
$("#tabs").tabs();
var $tabs = $('#tabs').tabs({ selected: 0 });
$tabs.tabs('option', 'selected', 0);
$("#tabs").tabs({disabled: [1,2,3]});
$(".btnNext").click(function () {
$( "#tabs" ).tabs( "option", "active", $("#tabs").tabs('option', 'active')+1 );
$("#tabs").tabs({disabled: [2,3]});
});
$(".btnNext_1").click(function () {
$( "#tabs" ).tabs( "option", "active", $("#tabs").tabs('option', 'active')+1 );
$("#tabs").tabs({disabled: [3]});
});
$(".btnPreview_1").click(function () {
$( "#tabs" ).tabs( "option", "active", $("#tabs").tabs('option', 'active')-1 );
});
$(".btnNext_2").click(function () {
$( "#tabs" ).tabs( "option", "active", $("#tabs").tabs('option', 'active')+1 );
$("#tabs").tabs({disabled: [4]});
});
$(".btnPreview_2").click(function () {
$("#tabs").tabs( "option", "active", $("#tabs").tabs('option', 'active')-1 );
});
});
</script>
</head>
<body>
<div id="tabs">
<ul>
<li><a href="#tabs-1">Step-1</br> Restaurant Info</a></li>
<li><a href="#tabs-2">Step-2</br>Owner Info</a></li>
<li><a href="#tabs-3">Step-3</br> POS Setup Info</a></li>
<li><a href="#tabs-4">Step-4</br> Terms and Conditions </a></li>
</ul>
<div id="tabs-1">
<center>
<p>Restaurant Info</p>
</center>
<table>
<tr>
<td>
<label for="RestaurentName">Restaurent Name</label></br>
<input class="easyui-validatebox" type="text" id="restauerntname" />
<td>
<td>
<label for="phone">Phone Number</label></br>
<input class="easyui-validatebox" type="text" id="PhoneNumber" />
</td>
</tr>
<tr>
<td>
<label for="Address1">Address 1</label></br>
<input class="easyui-validatebox" type="text" id="Address1" />
<td>
<td>
<label for="Address2">Address 2</label></br>
<input class="easyui-validatebox" type="text" id="Address2" />
</td>
</tr>
<tr>
<td>
<label for="city">City</label></br>
<input class="easyui-validatebox" type="select" id="city" />
<td>
<td>
<label for="state">State</label></br>
<input class="easyui-validatebox" type="select" id="State" />
</td>
</tr>
<tr>
<td>
<label for="zip">Zip/Postal Code</label></br>
<input class="easyui-validatebox" type="text" id="PostalCode" />
<td>
</tr>
<tr>
<td>
<input type="Button" class="btnNext" rel="tabs-2" value="Next Tab"/>
</td>
</tr>
</table>
</div>
<div id="tabs-2">
<center>
<p>Owner Info</p>
</center>
<table>
<tr>
<td>
<label for="FirstName">First Name</label></br>
<input type="text" id="FirstName" />
<td>
<td>
<label for="LastName">Last Name</label></br>
<input type="text" id="LastName" />
</td>
</tr>
<tr>
<td>
<label for="EmailID">Email ID(User ID)</label></br>
<input type="text" id="EmailID" />
<td>
<td>
<label for="ConfirmEmailID">Confirm Email ID</label></br>
<input type="text" id="ConfirmEmailID" />
</td>
</tr>
<tr>
<td>
<label for="Password">Password:</label></br>
<input type="text" id="Password" />
<td>
<td>
<label for="confirmpasswored">Confirm Password:</label></br>
<input type="text" id="confirmpasswored" />
</td>
</tr>
<tr>
<td>
<a class="btnPreview_1" href="#tabs-1">Previews Tab</a></br><a class="btnNext_1" href="#Tab-3">Next Tab</a>
</td>
</tr>
</table>
</div>
</body>
</html>