Home Tutorial Jquery jquery popup datepicker

 
 

Share on Google+Share on Google+
jquery popup datepicker
Posted on: August 13, 2010 at 12:00 AM
Advertisement
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

Advertisement

Related Tags for jquery popup datepicker:


Follow us on Twitter, or add us on Facebook or Google Plus to keep you updated with the recent trends of Java and other open source platforms.

Posted on: August 13, 2010

Recommend the tutorial

Advertisements Advertisements
 

 

 

DMCA.com