Topic: Timepicker 4.20 does not show on clicking the icon
I am unable to get the timepicker in MDB4 version 4.20 to show with my code, but it does work with the sample code.
The code I am using is this:
<div class="input-group timepicker" twelvehour="true">
<div class="input-group-prepend">
<div class="input-group-text"><i class="fa fa-clock-o"></i></div>
</div>
<input type="text" ID="startTime" CssClass="form-control" placeholder="hh:mm am/pm">
Also, is there a way to change the behavior so that clicking the input box will bring up the time picker? The same way it worked prior to this version.
Marcin Luczak staff answered 3 years ago
Hello,
Code specified in the documentation should not be changed in the way you did it as the Timepicker constructor checks for elements with specific classes and attributes to make component work.
To make your Timepicker open on the input click, please use this syntax:
<div class="md-form md-outline input-with-post-icon timepicker" id="myTimePicker" default="now">
<input type="text" class="form-control time-picker-opener" placeholder="Select time" data-open="myTimePicker">
<label >Access from outside</label>
<i class="fas fa-envelope input-prefix"></i>
</div>
Crucial here is adding time-picker-opener
class and data-open="your_timepicker"
to the element you want to Timepicker be opened with.
Keep coding, Marcin
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Answered
- User: Free
- Premium support: No
- Technology: MDB jQuery
- MDB Version: MDB4 4.19.2
- Device: desktop
- Browser: Edge
- OS: Win 10
- Provided sample code: No
- Provided link: No