2

I'm hoping someone can help my with this problem. I'm using ClockPicker with the "twelvehour" option set on a modal. The AM / PM buttons are not clickable at all. when attempting to click on the either one the clockPicker just vanishes. This is specific to Google Chrome, I tried it on PC and Mac. Works fine in Firefox.

I placed an alert on the AM button to see if it gets triggered and it does not.

$('<button type="button" class="btn btn-sm btn-default clockpicker-button am-button">'+ " AM" +'</button>')
            .on("click", function() {
                self.amOrPm = " AM"; 
                alert('Foo');
                $('.clockpicker-span-am-pm').empty().append(' AM');
            }).appendTo(this.amPmBlock);

outside a modal the alert fires but inside it does not. I also tried: 1. moving the clockpicker-span-am-pm element above the clickpicker-plate but the results were the same. 2. adding a z-index to clickpicker-span-am-pm and to clockpicker-button also did not yield any results. 3. making the modal big enough so that the clock picker is not outside of it.

The closest thing i found online with a similar issue was: How to get ClockPicker for Bootstrap (Plugin) to appear in a Bootstrap Modal pop up form?

which is what my jsfiddle is based on: http://jsfiddle.net/pLh5G/10/

I can't think of what else I can try, or how Chrome is treating it different.

Community
  • 1
  • 1
It.levon
  • 103
  • 1
  • 10

1 Answers1

1

After several hours of research. I decided to remove the AM PM block out of the clock picker and just use an extra button set provided by: http://www.bootstraptoggle.com/

It.levon
  • 103
  • 1
  • 10
  • I'm having the same problem and learned on GitHub that this clock picker is no longer maintained. – MsTapp Apr 17 '18 at 16:51