Home Tutorial Jquery jquery popup datepicker

 
 

jquery popup datepicker
Posted on: August 13, 2010 at 12:00 AM
In this section ,you will learn to implement the date picker inside html page.

jQuery popup Date picker

In this section ,you will learn to implement the date picker inside html page. The output of the example code given below contains a  input box in which you have to enter date. But for this , you need not to actually enter through key board . When you click on input box , it will display a date picker box. You have to just select the correct date ,month & year. The input box automatically take the value as date.

datePicker.html

<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8">
<title>jQuery Datepicker</title>
<style type="text/css">
@import "DatePicker/flora.datepick.css";
</style>
<script type="text/javascript" src="jquery-1.4.2.js"></script>
<script type="text/javascript" src="DatePicker/jquery.datepick.js">
</script>
<script type="text/javascript">
$(function() {
$('#popupDatepicker').datepick();

});
</script>
</head>
<body bgcolor="#ADFF2F">
<h1><font color="green">jQuery popup Date picker</font>
</h1>
<font color="green">
<p>Enter Date &nbsp;<input type="text" id="popupDatepicker">
</p>
</font>
</body>
</html>

OUTPUT

When you click inside input box :

Download Source Code

Click here to see demo

Related Tags for jquery popup datepicker:


Ask Questions?

If you are facing any programming issue, such as compilation errors or not able to find the code you are looking for.

Ask your questions, our development team will try to give answers to your questions.