In Node-Red I created a demo flow of the problem I’m having. If you Import the JSON below, after deploying, click between the UI tabs from the menu, the problem is clear, the timePicker nodes don’t display the current time (4:00PM). The debug nodes on each tab reflect the correct number value is being presented to the timePicker nodes.
Question, how to get the timePicker to display the data presented to the node?
[
{
"id": "3ab54eb0381845c3",
"type": "tab",
"label": "Home",
"disabled": false,
"info": "",
"env": []
},
{
"id": "d5502e51d7274ac1",
"type": "tab",
"label": "Flow 2",
"disabled": false,
"info": "",
"env": []
},
{
"id": "8eca70e427765f2f",
"type": "tab",
"label": "Flow 3",
"disabled": false,
"info": "",
"env": []
},
{
"id": "5f6eae2e6eb579f2",
"type": "ui_tab",
"name": "tab3",
"icon": "dashboard",
"order": 3,
"disabled": false,
"hidden": false
},
{
"id": "92a487e09790824b",
"type": "ui_group",
"name": "tab3",
"tab": "5f6eae2e6eb579f2",
"order": 1,
"disp": true,
"width": "6",
"collapse": false,
"className": ""
},
{
"id": "c6705d6da9ffa300",
"type": "ui_tab",
"name": "tab2",
"icon": "dashboard",
"order": 2,
"disabled": false,
"hidden": false
},
{
"id": "36051fd36cefb646",
"type": "ui_group",
"name": "tab2",
"tab": "c6705d6da9ffa300",
"order": 1,
"disp": true,
"width": "6",
"collapse": false,
"className": ""
},
{
"id": "013572846556406a",
"type": "ui_tab",
"name": "Home",
"icon": "dashboard",
"order": 1,
"disabled": false,
"hidden": false
},
{
"id": "297da67695230eca",
"type": "ui_group",
"name": "Home",
"tab": "013572846556406a",
"order": 1,
"disp": true,
"width": "6",
"collapse": false,
"className": ""
},
{
"id": "269fa8b94b12deda",
"type": "inject",
"z": "3ab54eb0381845c3",
"name": "",
"props": [
{
"p": "payload"
},
{
"p": "topic",
"vt": "str"
}
],
"repeat": "",
"crontab": "",
"once": true,
"onceDelay": 0.1,
"topic": "",
"payload": "57600000",
"payloadType": "num",
"x": 170,
"y": 100,
"wires": [
[
"e7d69a80b8cd80ce",
"02c35d85f48437df"
]
]
},
{
"id": "e7d69a80b8cd80ce",
"type": "link out",
"z": "3ab54eb0381845c3",
"name": "link out 1",
"mode": "link",
"links": [
"28880ce3b81e3400",
"d61a4056600c3b6e"
],
"x": 335,
"y": 100,
"wires": []
},
{
"id": "2e7dcc33adb2f8d7",
"type": "comment",
"z": "3ab54eb0381845c3",
"name": "HomePage",
"info": "When this flow loads the home page, the time is passed to tabs 2 and 3 where the time values should show. But unless the page is re-loaded from tab2 or or reloaded from tab3, the time is not displayed. The debug notes confirm the data is not binding in the TimePicker nodes. Oh, if the page is reloaded on tab2 and the user selects tab3, the Time Picker node is not bound to the data.",
"x": 100,
"y": 40,
"wires": []
},
{
"id": "02c35d85f48437df",
"type": "ui_text",
"z": "3ab54eb0381845c3",
"group": "297da67695230eca",
"order": 0,
"width": 0,
"height": 0,
"name": "",
"label": "Time 4:00PM or not?",
"format": "{{msg.payload}}",
"layout": "row-spread",
"className": "",
"style": false,
"font": "",
"fontSize": 16,
"color": "#000000",
"x": 380,
"y": 180,
"wires": []
},
{
"id": "6981f3d376aa8838",
"type": "ui_template",
"z": "3ab54eb0381845c3",
"group": "297da67695230eca",
"name": "errorDescription",
"order": 1,
"width": 0,
"height": 0,
"format": "<div>n<p>When this flow loads the home page, the time is passed to tabs 2 and 3 where the time values should show. But unless thenpage is reloaded while tab2 is displayed or reloaded while tab3 is displayed, the time value does not bind to the node and no vlaue is displayed.</p> n<br>n<p>The debug notes confirm the data is being presented to the timePicker nodes.</p>n<br>n<p>When the page is reloaded on tab2 and the user selects tab3, the Time Picker node is again not bound to the data and vice versa is also true.</p>n<br>n<p><b style='color:red;'>What am I doing wrong?</b><p/>nn</div>",
"storeOutMessages": true,
"fwdInMessages": true,
"resendOnRefresh": true,
"templateScope": "local",
"className": "",
"x": 220,
"y": 260,
"wires": [
[]
]
},
{
"id": "d61a4056600c3b6e",
"type": "link in",
"z": "d5502e51d7274ac1",
"name": "link in 2",
"links": [
"e7d69a80b8cd80ce"
],
"x": 65,
"y": 80,
"wires": [
[
"81ea7377463e6ea4",
"a189903c7c46a061"
]
]
},
{
"id": "81ea7377463e6ea4",
"type": "ui_text_input",
"z": "d5502e51d7274ac1",
"name": "tab2 timePicker",
"label": "",
"tooltip": "",
"group": "36051fd36cefb646",
"order": 22,
"width": "3",
"height": "1",
"passthru": true,
"mode": "time",
"delay": "300",
"topic": "topic",
"sendOnBlur": true,
"className": "",
"topicType": "msg",
"x": 240,
"y": 80,
"wires": [
[
"056137dcf3bd8a8d"
]
]
},
{
"id": "a189903c7c46a061",
"type": "debug",
"z": "d5502e51d7274ac1",
"name": "tab2 debug value",
"active": true,
"tosidebar": true,
"console": false,
"tostatus": false,
"complete": "payload",
"targetType": "msg",
"statusVal": "",
"statusType": "auto",
"x": 250,
"y": 140,
"wires": []
},
{
"id": "056137dcf3bd8a8d",
"type": "debug",
"z": "d5502e51d7274ac1",
"name": "tab2 passthrough value",
"active": true,
"tosidebar": true,
"console": false,
"tostatus": false,
"complete": "payload",
"targetType": "msg",
"statusVal": "",
"statusType": "auto",
"x": 530,
"y": 80,
"wires": []
},
{
"id": "28880ce3b81e3400",
"type": "link in",
"z": "8eca70e427765f2f",
"name": "link in 1",
"links": [
"e7d69a80b8cd80ce"
],
"x": 85,
"y": 80,
"wires": [
[
"156d0a44323d2cc2",
"dadd31fbe624c65a"
]
]
},
{
"id": "156d0a44323d2cc2",
"type": "ui_text_input",
"z": "8eca70e427765f2f",
"name": "tab3 timePicker",
"label": "",
"tooltip": "",
"group": "92a487e09790824b",
"order": 22,
"width": "3",
"height": "1",
"passthru": true,
"mode": "time",
"delay": "300",
"topic": "topic",
"sendOnBlur": true,
"className": "",
"topicType": "msg",
"x": 280,
"y": 80,
"wires": [
[
"d968435f97d2ec26"
]
]
},
{
"id": "dadd31fbe624c65a",
"type": "debug",
"z": "8eca70e427765f2f",
"name": "tab3 debug value",
"active": true,
"tosidebar": true,
"console": false,
"tostatus": false,
"complete": "payload",
"targetType": "msg",
"statusVal": "",
"statusType": "auto",
"x": 290,
"y": 160,
"wires": []
},
{
"id": "d968435f97d2ec26",
"type": "debug",
"z": "8eca70e427765f2f",
"name": "tab3 passthrough value",
"active": true,
"tosidebar": true,
"console": false,
"tostatus": false,
"complete": "payload",
"targetType": "msg",
"statusVal": "",
"statusType": "auto",
"x": 550,
"y": 80,
"wires": []
}
]
Thanks in advance for any suggestion.