Adding the datepicker in events plugin

  • Resolved Guido

    (@guido07111975)


    9 years, 12 months ago

    Hi,

    I try to add the datepicker to the date field of my plugin but I cannot make it work.

    1) I enqueue scripts:

    function enqueue_date_picker(){
	wp_enqueue_script( 'my_script', plugins_url( '/js/script.js' , __FILE__ ), array('jquery', 'jquery-ui-core', 'jquery-ui-datepicker'), '1.0', true );
	wp_enqueue_style('my_style', 'https://code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css');
}
add_action( 'admin_enqueue_scripts', 'enqueue_date_picker' );

    2) My input field:

    <input class="widefat" id="date" type="text" name="date" value="<?php echo date( 'j F Y', $event_date ); ?>" />

    3) Added file called script.js in folder /js with content:

    $(function() {
$( "#date" ).datepicker();
})( jQuery );

    I notice all scripts are loaded in head section of backend.
    My .js script file is loaded in footer section.
    Nothing happens when I click the date field.
    So what am I doing wrong here?

    Have a nice weekend!

    Guido

Viewing 2 replies - 1 through 2 (of 2 total)

  • When working with js always use the browser console to help detect errors in your code. Change your js code to this:

    (function($) {
$( "#date" ).datepicker();
})( jQuery );

    or this:

    jQuery(document).ready(function ($) {
  $( "#date" ).datepicker();
});

    And one more thing, I would suggest loading your custom script only on your plugin page(s), your code will always include your custom js code on all admin pages. And let say we have an input field with the id date on another admin/plugin page , your code will trigger a ui for that the input field too.

    Thread Starter Guido

    (@guido07111975)

    Hi,

    Thank you very much, it does work with your second piece of code ??

    I used this tutorial but guess the js. there isn’t working properly.

    And yes, I will add an if statement to load datepicker only add event page.

    Thanks again.

    Guido

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘Adding the datepicker in events plugin’ is closed to new replies.