Topic: Time Picker
My goal is to be able to assign the time picker a time value based on what is pulled from a database and then be able to change it from that point.
Expected behavior To show the placeholder value that is set or show value that is set by using hours and minutes tags. To only execute getValue target when picker is changed.
Actual behavior It executes the function set in getValue on load and on change and always assigns time of 12:00AM to picker.
Resources (screenshots, code snippets etc.)
Below is the code snippets.
<MDBTimePicker id="StartTime" label="Start Time" placeholder="8:00AM" getValue={this.getPickerValue} />
getPickerValue just prints the picker value to the console.
Hi,
Placeholder is meant to fulfill the input when the user clears the picker value (clear button). For initial value, you have to use 'hours' and 'minutes' properties. Why? Because when the user will submit the form without changing the value, the picker input's value would be empty. That is why the getValue is executed on mount too -> to initialize the default picker value.
But we are always open to suggestions. Do you think that we should refactor placeholder to be rendered as picker value on mount?
Best regards,
Jakub
Thanks Jakub. I set hours and minutes and that does the trick. I am not sure how many people need it to function the way I do but I pull a string time from DB (ie. 10:30 AM or 3:00 PM). Instead of having to write a function to parse out the ours and minutes and convert it to a 24hr format it would be nice to just be able to say, for example, value = "10:30 AM", and the component can handle it.
That being said, thanks for your answer and this will get me the results I need with just a little more work.
Jakub Mandra staff premium commented 6 years ago
I'm glad it helped. Also thanks for the suggestion, it indeed could be a useful feature. We will take it into consideration :)
Best,
Jakub
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 React
- MDB Version: 4.11.0
- Device: Website
- Browser: Chrome
- OS: Mac OSX
- Provided sample code: No
- Provided link: No
salphonso commented 6 years ago
Also, even if I remove getValue and just use placeholder, 12:00AM is still what shows.