Tag: datepicker

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.