web-dev-qa-db-fra.com

Datepicker ne supportant pas timepicker

La datepicker fonctionne parfaitement mais datetimepicker ne fonctionne pas à l'avant dans wordpress-4.6.1.

Modifier

Je l'ai obtenu en HTML statique en utilisant bootstrap-datetimepicker.js mais je ne veux pas utiliser ce sélecteur dans WordPress. Je veux réaliser cela uniquement en utilisant wordpress datepicker. C'est possible?

HTML

<input type="text" name="date1" id="date1" value="" />
<input type="text" name="datetime" id="datetime" value="" />

wp_enqueue_scripts

add_action('wp_enqueue_scripts', 'custom_datepicker');
function custom_datepicker() {
    wp_enqueue_script('jquery-ui-datepicker');
    wp_enqueue_script('jquery-ui-core');    
}

JS

add_action('wp_head','custom_header_script');
function custom_header_script() {
?>
    <script type="text/javascript">
        jQuery(document).ready(function($){
            $('#date1').datepicker();
            $('#datetime').datepicker({
               timeFormat:'hh:mm'
            });
        });
    </script>
<?php
}
2
SCC

Wordpress ne prend en charge que datepicker. Si vous souhaitez ajouter timepicker dans datepicker, vous devez utiliser jquery-ui-timepicker-addon comme extension dans votre thème ou plug-in.

Ajouter css et js comme ci-dessous

add_action('wp_enqueue_scripts', 'custom_datepicker');
function custom_datepicker() {
    //wp_enqueue_script('jquery-ui-datepicker');
    //wp_enqueue_script('jquery-ui-core');          
    wp_enqueue_script('jquery-ui-timepicker-addon',get_stylesheet_directory_uri().'/js/jquery-ui-timepicker-addon.js',array());
    wp_enqueue_style('jquery-ui-timepicker-addon',get_stylesheet_directory_uri().'/css/jquery-ui-timepicker-addon.css',array());
    wp_enqueue_style('jquery-ui',get_stylesheet_directory_uri().'/css/jquery-ui.css',array());  
}

Vous pouvez télécharger tous les fichiers css et js à partir de ce lien http://trentrichardson.com/examples/timepicker/

Appelez timepicker comme ci-dessous

<script type="text/javascript">
    jQuery(document).ready(function($){
        $('#datetime').datetimepicker({
          timeFormat: "hh:mm",
          dateFormat : 'yy-mm-dd'
        });
    });
</script>
2
user19922801