I’m using oh-input-card with datepicker.
In general the component works, except when the item is in state NULL
In this case, I’m not able to set a date/time for unknown reason.
Once I assign a proper date/time to the item using APIExplorer, the datepicker works as expected.
Any idea how to overcome the NULL issue?
What version of OH are you using. Just this weekend I set a bunch of NULL DateTime Items with
value: oh-input-card
config:
outline: true
clearButton: true
inputmode: text
footer: =items.Default_Bed.state
placeholder: hh:mm:ss
title: Default Bed time
calendarParams:
timePicker: true
dateFormat:
hour: numeric
minute: numeric
type: datetime-local
sendButton: true
1 Like
Hello Rich - I‘m using 3.1.0M4
I’m on a snapshot from late last week so maybe this is something that has already been fixed?
I just see that you use a different component I think.
This is my widget Configuration.
- component: oh-input-item
config:
title: Startzeit
type: datepicker
sendButton: true
validate: true
required: true
item: =props.propItem + '_Timer_Startzeit'
outline: false
calendarParams:
timePicker: true
dateFormat:
month: long
day: numeric
hour: numeric
minute: numeric
style:
--f7-input-bg-color: "#b5b5b5"
I changed the type to: datetime-local instead of datepicker.
Now I can set the date/time as well. However, the value always disappears in the input box field after it was set. Is this a normal behavior?
EDIT: I added a footer to display the item state as workaround. The calenderParams are useless when using type datetime-local as far as I see.
Yes, that’s normal. That’s why I put the state of the Item in the footer.
1 Like
I have been trying to instantiate a simple, working timepicker widget for quite some time now for the purpose of bootstrapping.
I want to use the “time” input widget as it’s graphically nicer than any text-alike input.
Unfortunately right on Firefox on PC which I use per default, I keep seeing what @rlkoshak did (cannot click into). Chrome, Edge and even Firefox on Android work with the same widget code, there’s a clock symbol appearing, but not on my PC.
Has anyone gotten ‘time’ icon to appear and work with Firefox/PC?
My input card works just fine in my pc but when I try to use my iPhone or iPad I can access the input field:
If I modify the code and change
type to datetime instead of datetime-local I get kind of a strange input field that does work on mobile devices but doesn’t work on the macbook/pc.
Any ideas?
I running the latest stable but previous stable had the same issue.
I know that the fields are implemented differently from one browser to the next. Perhaps they are not implemented correctly on Apple. I’m not sure what you can do about it short of just making it a plain old text field instead of a datetime type.
Thanks for the response. Think it is the iPhone and iPad that are the culprit because the mac does do ok. Chrome browser on the 2 former devices have the same issue…
All,
Setting this default state, is this meant to carry across reboots because my items that I do this for (input-card) are showing as NULL after reboots.
Just like in OH 2.x, to persist the state of an Item across reboots one must use Persistence. Unlike in OH 2.x, OH 3 will install rrd4j by default and save everything that rrd4j supports with restoreOnStartup. But since you are coming from 2.5 I suspect either you are using addons.cfg which means rrd4j is probably not installed, or you have an rrd4j.persist file which is configured not to restoreOnStartup these Items.
1 Like
Im using Influx/map but ive added the items into persistence now.
Many thanks for this nice tutorial. I’m wondering why the time has different formats (12/24). E.g. in post #1 (last figure) time in the footer is clearly in 24 hour format but in Yannick’s post #2 the Time input is in 12 hour format. I have exactly the same situation which is somewhat annoying.
The config in the original post just shows the default rendering of the DateTime without any custom formatting applied. If you want to change that define a State Description Pattern to format the DateTime as you want and charger the widget config to use displayState instead of state.
Unfortunately it didn’t work for me. I followed the discussion in here, especially your post #9. I took pattern
"%tH:%tM"
from here.
In my UI the time is still in 12 hour format in the input field but in the footer it is in 24 hour format (see attached image).
There are two changes I’ve said you need to make.
You’ve shown that you changed the State Description Pattern.
Did you also change the widget to use displayState instead of state?
1 Like
Yes, I made these two changes. I’ll have a look at settings again in the evening. Hopefully I manage to change the time to 24 hour format. I made a rule to poll my Modbus device to read the time because it disappears from the input box after I have clicked the check mark.
i do have the same issue with time format , it always shows " --:-- --"
could you share the input card code example which has working 24 hour formatting i can get my input for time running with 24h
here is what i tried.
component: oh-input-card
config:
action: command
footer: Time "hh:mm"
inputmode: text
item: StartZeitBewaesserungVentil4
placeholder: hh:mm
required: true
sendButton: true
title: Startzeit Microdrip
type: time
timeFormat: HH:MM
validate: true
useDisplayState: true
pattern: "%tH:%tM"
String StartZeitBewaesserungVentil4 <time> (gBewaesserungComputer) { stateDescription=""[pattern="%tH:%tM"]}
thx
Hi, I’m not quite sure what causes your problem but in my input card I have displaystate and perhaps you could try it. See my code below.
value: oh-input-card
config:
footer: =items.Pihavalot_Off.displayState
inputmode: text
outline: true
placeholder: HH:mm
sendButton: true
type: time
validate: true
validate-on-blur: false