Jquery calender in asp.net

1 . http://trentrichardson.com/examples/timepicker/


2.Place your js and css code file in head oft he plugin
<style type="text/css">
<link rel="stylesheet" media="all" type="text/css" href="http://trentrichardson.com/examples/timepicker/css/ui-lightness/jquery-ui-1.8.14.custom.css" />
body,img,p,h1,h2,h3,h4,h5,h6,form,table,td,ul,li,dl,dt,dd,pre,blockquote,fieldset,label{
margin:0;
padding:0;
border:0;
}
body{ background-color: #363531; border-top: solid 4px #C60; font: 90% Arial, Helvetica, sans-serif; padding: 20px; }
h1,h2{ margin: 10px 0; }
p{ margin: 10px 0; }
pre{ padding: 20px; background-color: #ffffcc; border: solid 1px #fff;display:none }
.wrapper{ background-color: #ffffff; width: 800px; border: solid 1px #eeeeee; padding: 20px; margin: 0 auto; }
.example-container{ background-color: #f4f4f4; border-bottom: solid 2px #777777;}
.example-container p{ font-weight: bold; }
.example-container dt{ font-weight: bold; height: 20px; }
.example-container dd{ margin: -20px 0 10px 100px; border-bottom: solid 1px #fff; }
.example-container input{ width: 150px; }
.clear{ clear: both; }
#ui-datepicker-div{ font-size: 80%; }
/* css for timepicker */
.ui-timepicker-div .ui-widget-header{ margin-bottom: 8px; }
.ui-timepicker-div dl{ text-align: left; }
.ui-timepicker-div dl dt{ height: 25px; }
.ui-timepicker-div dl dd{ margin: -25px 10px 10px 65px; }
.ui-timepicker-div td { font-size: 90%; }
</style>
<%--http://trentrichardson.com/examples/timepicker/js/jquery-1.5.1.min.js--%>
<script type="text/javascript" src="../timepicker/jquery-1.5.1.min.js"></script>
<script type="text/javascript" src="../timepicker/jquery-ui-1.8.14.custom.min.js"></script>
<script type="text/javascript" src="../timepicker/jquery-ui-timepicker-addon.js"></script>
<script type="text/javascript"> $(function(){
$('.example-container > pre').each(function(i){
eval($(this).text());
});
});
</script>


<script type="text/javascript" src="view-source:http://trentrichardson.com/examples/timepicker/js/jquery-1.5.1.min.js"></script>
<script type="text/javascript" src="view-source:http://trentrichardson.com/examples/timepicker/js/jquery-ui-1.8.14.custom.min.js"></script>
<script type="text/javascript" src="view-source:http://trentrichardson.com/examples/timepicker/js/jquery-ui-timepicker-addon.js"></script>

<script type="text/javascript">
$(function(){
$('.example-container > pre').each(function(i){
eval($(this).text());
});
});
</script>


3.Place the input control in body

<div class="example-container"><div><asp:TextBox type="text" name="example2" id="example2" value="" runat="server" ></asp:TextBox></div></div>
<pre>
$('#ctl00_ContentPlaceHolder1_taskinsert_ctl12_example2').datetimepicker({
ampm: true,
minDate: 0,
maxDate: 30
});

</pre>