Topic: TimePicker Feature Requests

ShadowshotSys free asked 3 years ago

  1. Option to enable rounding on units. eg. round hours to nearest 2, round minutes to nearest 5
  2. Option to enable string format (eg H:mm or HH:mm tt or hh:mm or hh:mm:ss)

Resources (screenshots, code snippets etc.)

<mdb-time-picker [buttonLabel]="'Done'"
                               [label]="'Clock In'"
                               [ngModel]="clockIn" (timeChanged)="clockIn_changed($event)"></mdb-time-picker>

Arkadiusz Idzikowski staff commented 3 years ago

Thank you for sharing this ideas with us, we will discuss this features with our design team.

Could you add more information and examples for the first feature?

ShadowshotSys free commented 3 years ago

Happy to.

I'm creating a timesheet and we don't want employees clocking in at 7:07, we want the ability to only select the nearest n minutes depending on employee (their role some are rounded to nearest 5 mins, others to nearest 15). Or if our service reps have a charge out rate rounded to 2 hours, it would be nice to implement that on the component itself, rather than a validation check.

We could pass in an object for each unit increment option that allows us to set what the increment is for each value (hour, minute).

This tool does a really good job at handling this scenario (see 'increment'

It also handles scenarios like break/lunch durations better because it allows the ability to turn on/off AM/PM through a string format, or what if I only want minutes or hours?

For example, if I want to implement a break/lunch duration time picker (hh:mm format), I would have to manually hide the am/pm buttons through ::ng-deep, then trim the AM/PM off the text on the timeChanged event. I'm still new to your tools, so this may be possible, but I haven't seen anything in the documentation about it.

Please insert min. 20 characters.


Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.



Specification of the issue

  • User: Free
  • Premium support: No
  • Technology: MDB Angular
  • MDB Version: 8.7.0
  • Device: PC
  • Browser: Chrome
  • OS: Windows 10
  • Provided sample code: No
  • Provided link: No