I created a custom post type with a couple of fields where the user can enter the start date and the end date for a project.
I am trying to implement the jQuery datepicker but nothing happens when I click on the input fields using 1.7.3; if I use 1.8 it throws an error $(input).zIndex is not a function
Update:
Here is the 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>';
}
Thank you for your help
maybe you include your scripts ui-core and picker too early. Use
wp_enqueue script()
to include on the right hook. You must not include ui-core, only datepicker!example:
any tutorials:
I use the datepicker on different plugins and works fine, but it is necessary, that the order is correctly.