将jQuery UI数据选取器添加到管理面板

时间:2011-03-15 作者:Mirko

我创建了一个自定义帖子类型,其中包含两个字段,用户可以在其中输入项目的开始日期和结束日期。

我试图实现jQuery datepicker,但当我使用1.7.3单击输入字段时,什么都没有发生;如果我使用1.8,它会抛出一个错误$(input).zIndex is not a function

更新时间:

下面是函数

  function webfolio_show_timespan_box(){
  ?>
  <script type="text/javascript" src="<?php bloginfo(\'stylesheet_directory\')?>/js/jquery.ui-core.js"></script>
  <script type="text/javascript" src="<?php bloginfo(\'stylesheet_directory\')?>/js/jquery.picker.min.js"></script>
  <link type="text/css" rel="stylesheet" href="<?php bloginfo(\'stylesheet_directory\')?>/css/smoothness/jquery.custom.css" />
  <script>
   jQuery(function() {
    jQuery( ".datepicker" ).datepicker();
   });
    </script>
    <?php
    global $timespan_box, $post, $prefix;

    echo \'<input type="hidden" name="webfolio_meta_box_nonce" value="\',    wp_create_nonce(basename(__FILE__)), \'" />\';

     echo \'<table class="form-table">\';

     foreach ($timespan_box[\'fields\'] as $field) {
        // get current post meta data
        $meta = get_post_meta($post->ID, $field[\'id\'], true);

        echo \'<tr style="border:1px solid #e3e3e3;">\',
            \'<th style="width:20%; font-weight:bold;"><label for="\', $field[\'id\'], \'">\', $field[\'name\'], \'</label></th>\',
            \'<td>\';
        echo \'<input class="datepicker" type="text" name="\', $field[\'id\'], \'" id="\', $field[\'id\'], \'" value="\', $meta ? $meta : $field[\'std\'], \'" size="30" style="width:20%" />\', \'<br />\', $field[\'desc\'];
        echo \'<td></tr>\';
       }

    echo \'</table>\';
}
谢谢你的帮助

1 个回复
最合适的回答,由SO网友:bueltge 整理而成

也许您过早地包含脚本ui核心和选择器。使用wp_enqueue script() 包括在右挂钩上。您不能包含ui核心,只能包含日期选择器!

示例:

wp_enqueue_script( \'jquery-ui-datetimepicker\', \\
  $this->get_plugins_url( \'js/ui.datetimepicker.js\', __FILE__ ), \\
  array(\'jquery-ui-core\') , 0.1, TRUE );`
任何教程:

我在不同的插件上使用datepicker,效果很好,但必须确保顺序正确。

结束

相关推荐