jQuery anytime picker not working

Question

I have a datepicker and time picker in my code as you can see below, but only the datepicker works. When I click the field with the timepicker it does not show a dropdown box?

    <script type="text/javascript" src="~/assets/js/plugins/pickers/datepicker.js"></script>
    <script type="text/javascript" src="~/assets/js/plugins/pickers/anytime.min.js"></script>

    <script type="text/javascript">
    $(document).ready(function () {
        $(".text").hide();
        $("#r1").click(function () {
            $(".text").show();
        });
        $("#r2").click(function () {
            $(".text").hide();
        });
        $(function () {
            $(".datepicker").datepicker({
                format: 'dd/mm/yyyy'
            });
            $(function () {
                $(".timepicker").anytime({

                })

            });
        });
    });
</script>

Thanks in advance

Answer 1

I have integrated code for working example of Anytime Picker

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <script src="http://code.jquery.com/jquery-1.11.0.min.js"></script> <script src="http://www.ama3.com/anytime/anytime.5.1.2.min.js"></script> <script> AnyTime.picker( "field1", { format: "%W, %M %D in the Year %z %E", firstDOW: 1 } ); $("#field2").AnyTime_picker( { format: "%H:%i", labelTitle: "Hora", labelHour: "Hora", labelMinute: "Minuto" } ); </script> 

 <style> /* anytime.5.1.2.min.css Copyright 2008-2015 Andrew M. Andrews III. License: creativecommons.org/licenses/by-nc-sa/3.0/ Any+Time is a trademark of Andrew M. Andrews III */ .AnyTime-pkr *{border:0;font:inherit;font-size:x-small;font-style:normal;font-weight:400;list-style-type:none;margin:0;padding:0;white-space:nowrap;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box}.AnyTime-win{background-color:#F0F0F1;border:3px solid silver;display:inline-block;font:normal normal normal xx-small/normal sans-serif;-moz-border-radius:6px;-webkit-border-radius:6px;border-radius:6px}.AnyTime-pkr,.AnyTime-pkr *{text-align:center}.AnyTime-pkr .AnyTime-cloak{background-color:#D7D7D7;opacity:.7;position:absolute;filter:alpha(opacity=70)}.AnyTime-pkr .AnyTime-hdr{background-color:#D0D0D1;color:#606062;font-family:Arial,Helvetica,sans-serif;font-size:medium;font-weight:400;-moz-border-radius:2px;-webkit-border-radius:2px;border-radius:2px}.AnyTime-pkr .AnyTime-x-btn{background-color:#FCFCFF;border:1px solid #F99;color:#FF9F9F;cursor:default;float:right;margin:.25em .25em 0 0;width:1.5em;-moz-border-radius:.4em;-webkit-border-radius:.4em;border-radius:.4em}.AnyTime-pkr .AnyTime-btn{background-color:#FCFCFE;border:1px solid #999;color:#606062;cursor:default;font-family:Arial,Helvetica,sans-serif;margin:0 .1em .1em 0;padding:.2em .3em;-moz-border-radius:.1em;-webkit-border-radius:.1em;border-radius:.1em}.AnyTime-pkr .AnyTime-body{margin:0 1em 1em 0}.AnyTime-pkr .AnyTime-date{display:inline-block;margin-left:1em;vertical-align:top}.AnyTime-pkr .AnyTime-lbl{color:#606063;font-family:Arial,Helvetica,sans-serif;font-size:100%;font-weight:400;font-style:normal;margin-top:.8em}.AnyTime-pkr .AnyTime-yrs{width:20em}.AnyTime-pkr .AnyTime-yrs-past-btn,.AnyTime-pkr .AnyTime-yrs-ahead-btn{display:inline-block;width:2.4em}.AnyTime-pkr .AnyTime-yr-prior-btn,.AnyTime-pkr .AnyTime-yr-cur-btn,.AnyTime-pkr .AnyTime-yr-next-btn{display:inline-block;width:4.8em}.AnyTime-pkr .AnyTime-mons{width:20em}.AnyTime-pkr .AnyTime-mons:after{content:"";display:table;clear:both}.AnyTime-pkr .AnyTime-mon-btn{float:left;width:3.2em}.AnyTime-pkr .AnyTime-mon7-btn{clear:left}.AnyTime-pkr .AnyTime-dom-table{background-color:#F0F0F1;border:1px solid #E3E3E4;border-spacing:1px;width:20em}.AnyTime-pkr th.AnyTime-dow{background-color:#C0C0C1;color:#fff;font-family:Arial,Helvetica,sans-serif;font-size:95%;font-weight:400;font-style:normal;padding:.1em .3em}.AnyTime-pkr .AnyTime-dom-btn{text-align:right;padding-right:.5em}.AnyTime-pkr .AnyTime-dom-btn-empty,.AnyTime-pkr .AnyTime-min-ten-btn-empty,.AnyTime-pkr .AnyTime-min-one-btn-empty,.AnyTime-pkr .AnyTime-sec-ten-btn-empty,.AnyTime-pkr .AnyTime-sec-one-btn-empty{background-color:#F3F3F4;border:1px solid #C0C0c1}.AnyTime-pkr .AnyTime-time,.AnyTime-pkr .AnyTime-hrs-am,.AnyTime-pkr .AnyTime-hrs-pm,.AnyTime-pkr .AnyTime-mins-tens,.AnyTime-pkr .AnyTime-mins-ones,.AnyTime-pkr .AnyTime-secs-tens,.AnyTime-pkr .AnyTime-secs-ones{display:inline-block}.AnyTime-pkr .AnyTime-hrs,.AnyTime-pkr .AnyTime-mins,.AnyTime-pkr .AnyTime-secs,.AnyTime-pkr .AnyTime-offs{display:inline-block;margin-left:1em}.AnyTime-pkr .AnyTime-hr-btn{text-align:right;width:3.5em}.AnyTime-pkr .AnyTime-min-ten-btn,.AnyTime-pkr .AnyTime-min-one-btn{width:2em}.AnyTime-pkr .AnyTime-sec-ten-btn,.AnyTime-pkr .AnyTime-sec-one-btn{width:2em}.AnyTime-pkr .AnyTime-off-cur-btn{display:inline-block;overflow:hidden}.AnyTime-pkr .AnyTime-off-select-btn{display:inline-block;vertical-align:top;width:2em}.AnyTime-pkr .AnyTime-yr-selector{position:absolute}.AnyTime-pkr .AnyTime-body-yr-selector{margin:.8em 1em}.AnyTime-pkr .AnyTime-yr-mil,.AnyTime-pkr .AnyTime-yr-cent,.AnyTime-pkr .AnyTime-yr-dec,.AnyTime-pkr .AnyTime-yr-yr,.AnyTime-pkr .AnyTime-yr-era{display:inline-block;vertical-align:top}.AnyTime-pkr .AnyTime-mil-btn,.AnyTime-pkr .AnyTime-cent-btn,.AnyTime-pkr .AnyTime-dec-btn,.AnyTime-pkr .AnyTime-yr-btn{width:2em}.AnyTime-pkr .AnyTime-era-btn{margin-left:1em}.AnyTime-pkr .AnyTime-off-selector{margin:1em 2em;position:absolute}.AnyTime-pkr .AnyTime-body-off-selector{margin:.8em 1em;overflow-x:hidden;overflow-y:auto;white-space:nowrap}.AnyTime-pkr .AnyTime-off-off-btn{text-align:left}.AnyTime-pkr .AnyTime-cur-btn{border:1px solid #333334;background-color:#C0C0C1;color:#FCFCFE;font-weight:700}.AnyTime-pkr .AnyTime-out-btn{background-color:#F0F0F1;border:1px solid #C0C0c1}.AnyTime-pkr .AnyTime-focus-btn{border:1px dashed #000} </style> <style> #field2 { background-image:url("clock.png"); background-position:right center; background-repeat:no-repeat; border:1px solid #FFC030;color:#3090C0;font-weight:bold} #AnyTime--field2 {background-color:#EFEFEF;border:1px solid #CCC} #AnyTime--field2 * {font-weight:bold} #AnyTime--field2 .AnyTime-btn {background-color:#F9F9FC; border:1px solid #CCC;color:#3090C0} #AnyTime--field2 .AnyTime-cur-btn {background-color:#FCF9F6; border:1px solid #FFC030;color:#FFC030} #AnyTime--field2 .AnyTime-focus-btn {border-style:dotted} #AnyTime--field2 .AnyTime-lbl {color:black} #AnyTime--field2 .AnyTime-hdr {background-color:#FFC030;color:white} </style> 

 English: <input type="text" id="field1" size="50" value="Sunday, July 30th in the Year 1967 CE" /><br/> Español: <input type="text" id="field2" value="12:34" />