MY NODE

Thursday, July 29, 2010

jquery datepicker with current date and custom date format

I searched the net to find a more simpler solution to set the current date with jQuery UI datepicker but didn't find anything. So here is the solution I used. Mixture of both normal JavaScript and jQuery. You can also check out how to use a custom date format with jQuery UI datepicker.

var currentTime = new Date();
var month = currentTime.getMonth() + 1;
var day = currentTime.getDate();
var year = currentTime.getFullYear();
var d = year + "-" + month + "-" + day;

$('.date-pick').datepicker({ dateFormat: 'yy-mm-dd' }).val(d);

Wednesday, March 4, 2009

How to create a popup DatePicker for a text box using jQuery

For this we can use a very nice widget created by jQuery.
First we will download the datepicker widget from the site
http://jqueryui.com/download

Only select the Datepicker widget to download

After downloading the zip file, extract the files into a folder called jquery.


<html>
<head>
 <title>jQuery UI Datepicker - Default functionality</title>
 
<link type="text/css" href="jquery/theme/ui.all.css" rel="Stylesheet" /> 
<script type="text/javascript" src="jquery/jquery-1.3.1.js"></script>
<script type="text/javascript" src="jquery/jquery-ui-personalized-1.6rc6.js"></script>

<script type="text/javascript">
 $(function() {
  $("#datepicker").datepicker();
 });
 </script>
</head>
<body>

<p>Date: <input type="text" id="datepicker"></p>

</body>
</html>

You can read more about this Datepicker from here.
http://jqueryui.com/demos/datepicker/