web-dev-qa-db-fra.com

Timepicker-addon ne montre pas - Datepicker fonctionne bien?

UPDATEIl semble que cela puisse être un problème avec le,

  $("#opening_time").datetimepicker();
  $("#opening_time_end").timepicker();
  $("#closing_time_end").timepicker();

S'il y a un appel datetimepicker avant une timepicker, alors la timepicker ne fonctionne pas. Je ne comprends pas, car la datepicker fonctionne et tout est inclus de la même manière. Qu'est-ce que je rate?

Ajout réussi du Datepicker de l'interface utilisateur jQuery et même d'un sélecteur d'heure pour les champs time meta_box. J'essayais d'ajouter l'addition Timepicker de Trent Richardson et je n'arrive pas à le faire apparaître.

Voici le wp-enqueue dans functions.php.

      /**
   * Adds a jQuery datepicker script to Event pages.
   * http://jqueryui.com/demos/datepicker/
   */
  function pbd_events_jquery_datepicker() {
      wp_enqueue_script(
          'jquery-ui-datepicker',
          get_bloginfo('template_directory') . '/jquery-ui-datepicker/jquery-ui-1.8.16.custom.min.js',
          array('jquery')
      );
          wp_enqueue_script(
          'jquery-ui-timepicker',
          get_bloginfo('template_directory') . '/jquery-ui-datepicker/jquery.ui.timepicker.js',
          array('jquery')
      );
      wp_enqueue_script(
          'jquery-ui-timepicker-addon',
          get_bloginfo('template_directory') . '/jquery-ui-datepicker/jquery.ui.timepicker-addon.js',
          array('jquery')
      );

      wp_enqueue_script(
          'pbd-datepicker',
          get_bloginfo('template_directory') . '/jquery-ui-datepicker/pbd-datepicker.js',
          array('jquery', 'jquery-ui-datepicker', 'jquery-ui-timepicker', 'jquery-ui-timepicker-addon')
      );
  }
  add_action('admin_print_scripts-post-new.php', 'pbd_events_jquery_datepicker');
  add_action('admin_print_scripts-post.php', 'pbd_events_jquery_datepicker');

  /**
   * Adds CSS for the jQuery datepicker script to Event pages.
   * http://jqueryui.com/demos/datepicker/
   */
  function pbd_events_jquery_datepicker_css() {
      wp_enqueue_style(
          'jquery-ui-datepicker',
          get_bloginfo('template_directory') . '/jquery-ui-datepicker/css/smoothness/jquery-ui-1.8.16.custom.css'
      );
      wp_enqueue_style(
          'jquery-ui-timepicker',
          get_bloginfo('template_directory') . '/jquery-ui-datepicker/css/jquery.ui.timepicker.css'
      );
      wp_enqueue_style(
          'jquery-ui-timepicker-addon',
          get_bloginfo('template_directory') . '/jquery-ui-datepicker/css/jquery.ui.timepicker-addon.css'
      );
  }
  add_action('admin_print_styles-post-new.php', 'pbd_events_jquery_datepicker_css');
  add_action('admin_print_styles-post.php', 'pbd_events_jquery_datepicker_css');

Voici l'appel de fonction dans pbd-datepicker qui est ajouté dans le wp-enqueue.

      jQuery(function($) {
      $( "#start_date" ).datepicker({ dateFormat: 'yy/mm/dd', numberOfMonths: 2, minDate: 0 });
      $( "#end_date" ).datepicker({ dateFormat: 'yy/mm/dd', numberOfMonths: 4 });               

      $("#opening_time").datetimepicker();

      $("#opening_time_end").timepicker();
      $("#closing_time_end").timepicker();
      $("#artist_talk_time_end").timepicker();
      $("#lecture_time_end").timepicker();
      $("#panel_time_end").timepicker();
      $("#special_event_time_end").timepicker();
      $("#workshop_time_end").datetimepicker();
  });

Le champ de saisie ids est exact. J'ai vérifié et vérifié deux fois des fautes de frappe. Pourquoi les deux premiers scripts, jquery.ui.timepicker.js et datepicker, fonctionnent-ils, mais pas jquery.ui.timepicker-addon.js?

Est-ce que j'appelle le js mal?

Merci d'avance.

2
John Bentwin

Compris que j'avais besoin d'avoir les bonnes dépendances déclarées. Ce code fonctionne maintenant. J'espère que ça aide quelqu'un d'autre avec le même problème.

Ligne de touche array('jquery-ui-core' ,'jquery-ui-datepicker', 'jquery-ui-slider')

Code `wp-enqueue 'complet:

      function pbd_events_jquery_datepicker() {
    wp_enqueue_script(
          'jquery-ui-datepicker',
          get_bloginfo('template_directory') . '/jquery-ui-datepicker/jquery-ui-1.8.16.custom.min.js',
          array('jquery')
      );

        wp_enqueue_script(
          'jquery-ui-timepicker-addon',
          get_bloginfo('template_directory') . '/jquery-ui-datepicker/jquery-ui-timepicker-addon.js',
          array('jquery-ui-core' ,'jquery-ui-datepicker', 'jquery-ui-slider')
      );

      wp_enqueue_script(
          'pbd-datepicker',
          get_bloginfo('template_directory') . '/jquery-ui-datepicker/pbd-datepicker.js',
          array('jquery', 'jquery-ui-datepicker' , 'jquery-ui-timepicker-addon')
      );
  }
  add_action('admin_print_scripts-post-new.php', 'pbd_events_jquery_datepicker');
  add_action('admin_print_scripts-post.php', 'pbd_events_jquery_datepicker');

  /**
   * Adds CSS for the jQuery datepicker script to Event pages.
   * http://jqueryui.com/demos/datepicker/
   */
  function pbd_events_jquery_datepicker_css() {
      wp_enqueue_style(
          'jquery-ui-datepicker',
          get_bloginfo('template_directory') . '/jquery-ui-datepicker/css/smoothness/jquery-ui-1.8.16.custom.css'
      );
      wp_enqueue_style(
          'jquery-ui-timepicker-addon',
          get_bloginfo('template_directory') . '/jquery-ui-datepicker/css/jquery-ui-timepicker-addon.css'
      );
  }
  add_action('admin_print_styles-post-new.php', 'pbd_events_jquery_datepicker_css');
  add_action('admin_print_styles-post.php', 'pbd_events_jquery_datepicker_css');
2
John Bentwin