i want to add a datepicker on a custom page but i doesn not work. WP version is 3.2.1. Those are the init string i used on wp code:<\/p>\n
wp_enqueue_script('jquery');\nwp_enqueue_script('jquery-ui-core');\nwp_enqueue_script('jquery-ui-datepicker', get_bloginfo('template_url') . '\/js\/jquery-ui-datepicker.min.js', array('jquery','jquery-ui-core'));\nwp_enqueue_style('jquery.ui.theme', get_bloginfo('template_url') . '\/js\/smoothness\/jquery-ui-1.8.16.custom.css');\n<\/code><\/pre>\nThose enqueques generate this code:<\/p>\n
\n\n\n\n<\/code><\/pre>\nOn the page body, i use this code:<\/p>\n
\n jQuery('#datepicker').datepicker({\n dateFormat : 'yy-mm-dd'\n });\n\nData\n<\/code><\/pre>\nThe datepicker does not work. I do not know how to debug this issue. It does nothing, like the jQuery is not even there.<\/p>\n
UPDATE:<\/strong><\/p>\nWith your help i managed to debug the code. I placed the script after the div and changed into:<\/p>\n
\njQuery(document).ready(function() {\n jQuery('#datepicker').datepicker({\n dateFormat : 'yy-mm-dd'\n });\n});\n\n<\/code><\/pre>\nThis code give me error when calling the datepicker method, the error states:<\/p>\n
Uncaught TypeError: Object [object Object] has no method 'datepicker'\n<\/code><\/pre>\nIf i type jQuery(‘#datepicker’) on javascript console, i get this:<\/p>\n
[?]\n<\/code><\/pre>\nI get no other errors except for that one, all the references to jQuery seems to work fine.<\/p>\n
UPDATE 2:<\/strong><\/p>\nFinally i got it working! i had to place ‘wp_print_scripts’ instead of ‘init’, and i had to reposition some init code of another plugin that was conflicting. The only remaining issue are the themes… if i use the basic theme within googlecode, it works. If i use other themes (embedded in wp or linked with wp_enqueque_style) the theme will be not loaded…. if i check the generated html, there is no sign of the line that should load the jQuery theme.<\/p>\n
\n- \n
I often type things wrong. So, I would start debugging you copying and pasting the links to the JS scripts in your browser and make sure they load.<\/p>\n
Then in Chrome go to the Wrench Menu -> Tools -> JavaScript Console. Here you will be able to type\/execute your JavaScript directly. I would start off my typing jQuery<\/code> into the console to make sure jQuery is actually loaded. Then try doing jQuery('#datepicker')<\/code> if it returns empty brackets []<\/code> then your selector is failing. If it works, try opening up the datepicker – you will probably see an error in the JS console.<\/p>\nLike others have suggested, I think the problem is that the script is running before the is actually rendered. I would suggest doing the following:<\/p>\n
\njQuery(document).ready(function() {\n jQuery('#datepicker').datepicker({\n dateFormat : 'yy-mm-dd'\n });\n});\n\n<\/code><\/pre>\nThis will force the script to run after the entire page has loaded.<\/p>\n
== EXAMPLE ==<\/p>\n
add_action( 'init', 'wp29r01_date_picker' );\nfunction wp29r01_date_picker() {\n wp_enqueue_script( 'jquery' );\n wp_enqueue_script( 'jquery-ui-core' );\n wp_enqueue_script( 'jquery-datepicker', 'http:\/\/jquery-ui.googlecode.com\/svn\/trunk\/ui\/jquery.ui.datepicker.js', array('jquery', 'jquery-ui-core' ) );\n}\n\nadd_action( 'wp_footer', 'wp29r01_print_scripts');\nfunction wp29r01_print_scripts() {\n ?>\n\n jQuery(document).ready(function() {\n jQuery('#datepicker').datepicker();\n })<\/code><\/pre>\n<\/li>\n<\/ol>\nOriginally posted 2013-11-23 09:51:13. <\/small><\/p>","protected":false},"excerpt":{"rendered":"
i want to add a datepicker on a custom page but i doesn not work. WP version is 3.2.1. Those are the init string i used on wp code: wp_enqueue_script(‘jquery’); wp_enqueue_script(‘jquery-ui-core’); wp_enqueue_script(‘jquery-ui-datepicker’, get_bloginfo(‘template_url’) . ‘\/js\/jquery-ui-datepicker.min.js’, array(‘jquery’,’jquery-ui-core’)); wp_enqueue_style(‘jquery.ui.theme’, get_bloginfo(‘template_url’) . ‘\/js\/smoothness\/jquery-ui-1.8.16.custom.css’); Those enqueques generate this code: On the page body, i use this code: jQuery(‘#datepicker’).datepicker({ dateFormat […]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[],"class_list":["post-1494","post","type-post","status-publish","format-standard","hentry","category-uncategorized"],"_links":{"self":[{"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/posts\/1494","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/comments?post=1494"}],"version-history":[{"count":0,"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/posts\/1494\/revisions"}],"wp:attachment":[{"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/media?parent=1494"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/categories?post=1494"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/tags?post=1494"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}