Search code examples
jquerydatetimepickeradd-on

Getting JQuery DateTimePicker add-on to work

I've been trying to make this add-on work for over a week. I simply can't get it to show any dropdown

Here's my minimalist code:

CSS (Richardson's unchanged one)

.ui-timepicker-div .ui-widget-header { margin-bottom: 8px; }
.ui-timepicker-div dl { text-align: left; }
.ui-timepicker-div dl dt { height: 25px; margin-bottom: -25px; }
.ui-timepicker-div dl dd { margin: 0 10px 10px 65px; }
.ui-timepicker-div td { font-size: 90%; }
.ui-tpicker-grid-label { background: none; border: none; margin: 0; padding: 0; }

JQuery

<script type="text/javascript">
    $(function() {
        $('#test').datetimepicker();
    });
</script>

HTML

<input id="test" class="hasDatepicker" type="text" value="" name="test">

Library including

<script src="jquery-ui-timepicker-addon.js" type="text/javascript"></script>

JQuery libs are pulled from Google, CSS, Jquery CSS and Richardson's add-on are included in a separate file

Solution

  • I think your addition of

    class="hasDatepicker"

    has caused it not to work.

    I took your code and just removed that and it seems to work. Example at:

    JS Fiddle Example

    Note: I linked directly to the github versions of the timepicker js and css files.