<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<link href="css/bootstrap.min.css" rel="stylesheet" media="screen"/>
<link href="css/datepicker.css" rel="stylesheet" />
<script src="js/bootstrap.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script src="js/bootstrap-datepicker.js"></script>
<script src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
<script src="js/JavaScript.js"></script>
<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.9/jquery.validate.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<title></title>
</head>
<body>
<div>
<form class="form-horizontal" id="form1" runat="server">
<fieldset>
<!-- Form Name -->
<legend>Enter Your Details</legend>
<div class="control-group">
<label class="control-label input-xlarge" for="Status">Employment Status</label>
<div class="controls">
<select id="Select1" name="Status" class="input-xlarge" required="required">
<option id="test1" selected="selected">Salaried</option>
<option id="test2">Self Employed</option>
</select>
</div>
</div>
<div class="control-group">
<label class="control-label" for="CompanyName">Company Name</label>
<div class="controls">
<input id="Text1" name="CompanyName" type="text" placeholder="Enter Your Company Name" class="input-xlarge"/>
<p class="help-block">Type Slowly To Autofill</p>
</div>
</div>
<!--
<div class="control-group">
<label class="control-label" for="buttondropdown">Company Name</label>
<div class="controls">
<div class="input-append">
<input id="buttondropdown" runat="server" name="FullName" class="input-xlarge" placeholder="Enter Your Company Name" type="text" required="required" >
<div class="btn-group">
<button id="Button1" runat="server" class="btn dropdown-toggle" data-toggle="dropdown">
Select One
<span class="caret"></span>
</button>
<ul class="dropdown-menu">
<li> <select id="ddlviewby">
<option value="1" selected="selected">Salaried</option>
<option value="2">Self Employed</option>
</select>
</li>
</ul>
</div>
</div>
</div>
</div>
-->
<div class="control-group">
<label class="control-label input-xlarge" for="Loan">Type Of Loan</label>
<div class="controls">
<select id="Loan" name="Loan" class="input-xlarge">
<option>Personal Loan</option>
<option>Auto Loan</option>
<option>Education Loan</option>
<option>Home Loan</option>
</select>
</div>
</div>
<div class="control-group">
<label class="control-label" for="Salary">Salary</label>
<div class="controls">
<input id="Salary" name="Salary" type="text" placeholder="Enter Your Salary" class="input-xlarge"/>
</div>
</div>
<!-- Text input-->
<div class="control-group">
<label class="control-label" for="Name">Name</label>
<div class="controls">
<input id="Name" name="Name" type="text" placeholder="Enter Your Name" class="input-xlarge" runat="server">
</div>
</div>
<!-- Text input-->
<div class="control-group">
<label class="control-label" for="Email">Email</label>
<div class="controls">
<input id="Email" name="Email" type="email" placeholder="Enter Your Valid Email" class="input-xlarge" runat="server" data-validation="email">
</div>
</div>
<!-- Text input-->
<div class="control-group">
<label class="control-label" for="Contact">Contact No.</label>
<div class="controls">
<input id="Contact" name="Contact" type="text" placeholder="Enter Your Contact No." class="input-xlarge" max="10" runat="server"/>
</div>
</div>
<div class="control-group">
<label class="control-label" for="dp3">Date Of Birth</label>
<div class="controls">
<div class="input-append date input-xlarge" data-date="12-02-2012" data-date-format="dd-mm-yyyy"/>
<input id="dp3" name="dp3" type="text" placeholder="Enter Your DOB" class="input-xlarge" />
</div>
</div>
<br/>
<!-- Button -->
<div class="control-group">
<label class="control-label" for="Submit"></label>
<div class="controls">
<button id="Submit" name="Submit" class="btn btn-success" runat="server" >Submit</button>
</div>
</div>
</fieldset>
</form>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
</div>
<script src="http://jqueryvalidation.org/files/dist/jquery.validate.min.js"></script>
<script src="http://jqueryvalidation.org/files/dist/additional-methods.min.js"></script>
<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.9/jquery.validate.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script src="js/bootstrap.min.js"></script>
</body>
</html>
I am trying to validate the Required Field Validation in all the columns and Data Type Validation Eg:- Date Must Be Date not the text and i am also unable to use bootstrap datepicker . can anybody help me for this ? Please help me in creating jquery script for the validation ?