Has anybody used a time picker in this link?


I have already followed the steps in the link, I added the add-on.js file to my component and the css file inside, but when i change this code

var x = jQuery(this).attr("size");                  
    jQuery(this).datepicker({ minDate:"0"-120, maxDate: "0"-x,dateFormat:"yy-mm-dd" });

to this :

var x = jQuery(this).attr("size");                  
    jQuery(this).datetimepicker({ minDate:"0"-120, maxDate: "0"-x,dateFormat:"yy-mm-dd" });

nothing happens. I just want to add a timepicker to the datepicker I used from JqueryUI. Does joomla have something to do with this?

I used this code to load the javascript files from the link that I provided above :



here is a screenshot of the error when the page loads:

enter image description here

I was confused because from the link that I am following, it just used the .datetimepicker then it works, but when I use mine, it's not functioning.

The screenshot also displays $.ui is undefined, but that code came from the js file which was from the link I am following.

  • How are you calling the JS file?
    – Lodder
    Mar 23, 2015 at 8:10
  • hello sir, please see my updated post. Mar 23, 2015 at 8:16
  • follow-up question: from the link that I provided above, is this possible to use in joomla? Mar 23, 2015 at 8:17
  • Yes, it should still work in Joomla. When you view your site, are you getting any errors in the browser console log? Press F12 and check
    – Lodder
    Mar 23, 2015 at 8:18
  • I updated my post again, please see screenshot. I was confused because from the link that I am following, it just used the .datetimepicker then it works, but when I use mine, it's not functioning. Mar 23, 2015 at 8:24

1 Answer 1


I think I know what the issue may be, you need to wrap your code around jquery's document ready like so:

    var x = $(this).attr("size");                  
    $(this).datetimepicker({ minDate:"0"-120, maxDate: "0"-x,dateFormat:"yy-mm-dd" });

Note that I have used jQuery(document) (the global scope) and then used function($) so that the dollar symbol is an alias. This will prevent possible conflicts.


You also need to ensure you're importing jQuery UI which you can do using Joomla's built in methods like so:

  • I'm afraid my code is already wrapped around a document ready function but still the error exists.. datetimepicker is not a function. Mar 23, 2015 at 9:37
  • Try using my document ready please and let me know if you still have any issues
    – Lodder
    Mar 23, 2015 at 9:55
  • the error is still the same sir. Mar 23, 2015 at 10:12
  • Please provide the full code you're using and put it in pastebin.com so I can see it
    – Lodder
    Mar 23, 2015 at 10:13
  • pastebin.com/kjRydZgi here is the code Mar 23, 2015 at 10:18

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.