Tags

, , , ,


First write following code in template file. These code will include js and datepicker class in the template.

wp_enqueue_script('jquery');
wp_enqueue_script('jquery-ui-core');
wp_enqueue_script('jquery-ui-datepicker');
wp_enqueue_style('jquery-ui-css', 'http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.2/themes/smoothness/jquery-ui.css');


Write following php code in functions.php for date field. Or you can also write this code in template file.

<?php function add_datepicker_in_footer(){ ?>
<script type="text/javascript">
jQuery(document).ready(function(){
	jQuery('#date').datepicker({
		dateFormat: 'dd-mm-yy'
	});
});
</script>
<?php
} // close add_datepicker_in_footer() here
//add an action to call add_datepicker_in_footer function
add_action('wp_footer','add_datepicker_in_footer',10);

Add Id “date” to input field.

 <input id="date" name="date" />

That’s it. Refresh the page and you will see datepicker when you click on date field.

Advertisements