wordpress and jquery both are powerful tool. In plugin we need datepicker sometime. In this article i showed how to implement jquery UI datepicker in wordpress
implement jquery UI datepicker in wordpress
Some WP developers use the plugins to add the datepicker in wordpress. But you can add the Jquery datepicker in wordpress. How can use the Jquery UI in your wordpress theme and plugin using following code. For adding the datepicker in theme you need to just add the following code in functions.php file.
[viral-lock message=”Some Source code is Hidden! It’s Visible for Users who Liked/Shared This article on Facebook or Twitter or Google+. Like or Tweet this article to reveal the content.”]
add_action( 'init', 'wpapi_date_picker' );
function wpapi_date_picker() {
wp_enqueue_script( 'jquery' );
wp_enqueue_script( 'jquery-ui-core' );
wp_enqueue_script( 'jquery-datepicker', 'http://jquery-ui.googlecode.com/svn/trunk/ui/jquery.ui.datepicker.js', array('jquery', 'jquery-ui-core' ) );
}
add_action( 'wp_footer', 'wpapi_print_scripts');
function wpapi_print_scripts() {
?>
<script type="text/javascript">
jQuery(document).ready(function() {
jQuery('#datepicker').datepicker();
})
</script>
<!--?<span class="hiddenSpellError" pre="" data-mce-bogus="1"-->php
}
[/viral-lock]
For showing the datepicker control in theme or plugin use following code.
<script type="text/javascript">
jQuery(document).ready(function() {
jQuery('#datepicker').datepicker({
dateFormat : 'yy-mm-dd'
});
});
</script>
If you have any issue for adding the datepicker control then please add comment or email me.
Really helpful information…I searched this detail lot on google. Thanks
Ok i figured out how to make it, just needed to use other selector.
jQuery(document).ready(function() {
jQuery(‘input[name*=”date_field”]’).datepicker({
dateFormat : ‘yy-mm-dd’
});
});
This WILL make ALL fields who have in their name date_field to become fields with Datepicker.
Use custom post type for this and you can use taxonomy as custom field. you need to do the code some for that. you can search in my site for creating custom post type and custom fields with taxonomy. I already written code snippet for this.
I am not sure for which WordPress version this article is written but for WordPress version 3.6 and greater, we can directly use datepicker plugin as it is included by WordPress.
using following code:
wp_enqueue_script( ‘jquery-ui-datepicker’ );