I need help with datepicker...
| Project: | jQuery UI |
| Version: | 6.x-1.2 |
| Component: | Miscellaneous |
| Category: | support request |
| Priority: | normal |
| Assigned: | Unassigned |
| Status: | closed |
Jump to:
I'm desperate... spent 3 hours and couldn't figure why it doesn't work
Any help will be appreciated..
I installed the jquery_ui module
downloaded stable 1.5.2 jquery_ui and extracted it in the right directory
enabled the module...
everything went ok
I created a test page and added the following code (mostly taken from the jquery ui examples page)
jquery_ui_add(array('ui.datepicker','effects.drop'));
$js = <<<JAVASCRIPT_CODE
$("#anim").datepicker({
showAnim: "drop",
showOptions: {
direction: "up"
},
showOn: "both",
buttonImage: "sites/all/modules/poker_site/poker/deck/ad.gif",
buttonImageOnly: true
});
JAVASCRIPT_CODE;
drupal_add_js($js,'inline','header');
$output = '<input type="text" size="10" value="" id="anim"/>';
return $output;In my page's header I can see that all js files have been added
I verified each to make sure all links are valid (they are)
<script type="text/javascript" src="/misc/jquery.js?Q"></script>
<script type="text/javascript" src="/misc/drupal.js?Q"></script>
...<script type="text/javascript" src="/sites/all/modules/jquery_ui/jquery.ui/ui/minified/ui.core.min.js?Q"></script>
<script type="text/javascript" src="/sites/all/modules/jquery_ui/jquery.ui/ui/minified/ui.datepicker.min.js?Q"></script>
<script type="text/javascript" src="/sites/all/modules/jquery_ui/jquery.ui/ui/minified/effects.core.min.js?Q"></script>
<script type="text/javascript" src="/sites/all/modules/jquery_ui/jquery.ui/ui/minified/effects.drop.min.js?Q"></script>Inside the html body I can see
<script type="text/javascript">
<!--//--><![CDATA[//><!--
$("#anim").datepicker({
showAnim: "drop",
showOptions: {
direction: "up"
},
showOn: "both",
buttonImage: "sites/all/modules/poker_site/poker/deck/ad.gif",
buttonImageOnly: true
});
//--><!]]>
</script>
...
<input type="text" size="10" value="" id="anim"/>It doesn't work... :-(
I get the text field (without the image) and nothing pops when the field is focused
* I tried few more variations from the example page. none worked
* I have many other jQuery snippets and all of them are working fine
* When I use the "date module", popup datepicker works fine (but it works with an older version of datepicker)
What am I doing wrong???
#1
Including scripts in the header won't work as you expect because the page isn't yet loaded when the JavaScript is executed. You need to tell jQuery to execute after the page has finished loading. Katharine Bailey has an excellent article on this topic over at Rain City Studios: http://raincitystudios.com/blogs-and-pods/katherine-bailey/the-lowdown-j...
#2
It works!!... thanks a million...
Just changed the 'header' to 'footer' and it works like magic...
#3