Currently I‘m developing a front end for a plant operator to input data from production. One requirement is that the input can happen as fast as possible. The complete contents of the input should be selected when the operator clicks on it. This enables him to start typing new content immediately.
I‘ve created a custom input with an ˋui-template ˋ , md-input-containerˋ and ˋinputˋ elements and added an attribute ˋmd-select-on-focusˋ which in principle works, but this custom input field is much larger in size for whatever reason, like double of the normal height. This makes it impossible to arrange the required number of input fields on the screen.
The second attempt, to add css attributes to the standard input fields as header css with an ui-template had surprisingly no effect.
Does anyone know how to achieve this requirement?
[
{
"id": "a34331e3cff7a6db",
"type": "ui_text_input",
"z": "c68c434ebd730183",
"name": "",
"label": "Input 1",
"tooltip": "",
"group": "2839cdb7970bcfe6",
"order": 1,
"width": 0,
"height": 0,
"passthru": true,
"mode": "number",
"delay": 300,
"topic": "topic",
"sendOnBlur": true,
"className": "",
"topicType": "msg",
"x": 450,
"y": 180,
"wires": [
[]
]
},
{
"id": "f8ab290dd33a65bf",
"type": "ui_text_input",
"z": "c68c434ebd730183",
"name": "",
"label": "Input 2",
"tooltip": "",
"group": "2839cdb7970bcfe6",
"order": 2,
"width": 0,
"height": 0,
"passthru": true,
"mode": "number",
"delay": 300,
"topic": "topic",
"sendOnBlur": true,
"className": "",
"topicType": "msg",
"x": 450,
"y": 220,
"wires": [
[]
]
},
{
"id": "c0b591da9da4bcea",
"type": "ui_text_input",
"z": "c68c434ebd730183",
"name": "",
"label": "Input 3",
"tooltip": "",
"group": "2839cdb7970bcfe6",
"order": 3,
"width": 0,
"height": 0,
"passthru": true,
"mode": "number",
"delay": 300,
"topic": "topic",
"sendOnBlur": true,
"className": "",
"topicType": "msg",
"x": 450,
"y": 260,
"wires": [
[]
]
},
{
"id": "7e03f313a420abc4",
"type": "ui_text_input",
"z": "c68c434ebd730183",
"name": "",
"label": "Input 4",
"tooltip": "",
"group": "2839cdb7970bcfe6",
"order": 4,
"width": 0,
"height": 0,
"passthru": true,
"mode": "number",
"delay": 300,
"topic": "topic",
"sendOnBlur": true,
"className": "",
"topicType": "msg",
"x": 450,
"y": 300,
"wires": [
[]
]
},
{
"id": "d8a32ef60493dfb6",
"type": "ui_template",
"z": "c68c434ebd730183",
"group": "618988f65db60b7f",
"name": "Titel2",
"order": 2,
"width": 0,
"height": 0,
"format": "<md-input-container>\n <label>Titel2</label>\n <input type=\"number\" md-select-on-focus>\n</md-input-container>",
"storeOutMessages": true,
"fwdInMessages": true,
"resendOnRefresh": true,
"templateScope": "local",
"className": "",
"x": 710,
"y": 220,
"wires": [
[]
]
},
{
"id": "2e9ab8e295622786",
"type": "ui_template",
"z": "c68c434ebd730183",
"group": "618988f65db60b7f",
"name": "Titel3",
"order": 3,
"width": 0,
"height": 0,
"format": "<md-input-container>\n <label>Titel3</label>\n <input type=\"number\" md-select-on-focus>\n</md-input-container>",
"storeOutMessages": true,
"fwdInMessages": true,
"resendOnRefresh": true,
"templateScope": "local",
"className": "",
"x": 710,
"y": 260,
"wires": [
[]
]
},
{
"id": "c759278f3e3549f9",
"type": "ui_template",
"z": "c68c434ebd730183",
"group": "618988f65db60b7f",
"name": "Titel4",
"order": 4,
"width": 0,
"height": 0,
"format": "<md-input-container>\n <label>Titel4</label>\n <input type=\"number\" md-select-on-focus>\n</md-input-container>",
"storeOutMessages": true,
"fwdInMessages": true,
"resendOnRefresh": true,
"templateScope": "local",
"className": "",
"x": 710,
"y": 300,
"wires": [
[]
]
},
{
"id": "6f83e79f808f124c",
"type": "ui_template",
"z": "c68c434ebd730183",
"group": "2839cdb7970bcfe6",
"name": "",
"order": 4,
"width": 0,
"height": 0,
"format": "<style>\n input: {\n md-select-on-focus\n }\n</style>",
"storeOutMessages": true,
"fwdInMessages": true,
"resendOnRefresh": true,
"templateScope": "global",
"className": "",
"x": 170,
"y": 200,
"wires": [
[]
]
},
{
"id": "eddda2254c3c5d93",
"type": "ui_template",
"z": "c68c434ebd730183",
"group": "618988f65db60b7f",
"name": "Titel1",
"order": 1,
"width": 0,
"height": 0,
"format": "<md-input-container>\n <label>Titel1</label>\n <input type=\"number\" md-select-on-focus>\n</md-input-container>",
"storeOutMessages": true,
"fwdInMessages": true,
"resendOnRefresh": true,
"templateScope": "local",
"className": "",
"x": 710,
"y": 180,
"wires": [
[]
]
},
{
"id": "2839cdb7970bcfe6",
"type": "ui_group",
"name": "Column1",
"tab": "f3c98c364bdd77f3",
"order": 1,
"disp": true,
"width": "3",
"collapse": false,
"className": ""
},
{
"id": "618988f65db60b7f",
"type": "ui_group",
"name": "Template Inputs",
"tab": "f3c98c364bdd77f3",
"order": 2,
"disp": true,
"width": "6",
"collapse": false,
"className": ""
},
{
"id": "f3c98c364bdd77f3",
"type": "ui_tab",
"name": "Home",
"icon": "dashboard",
"disabled": false,
"hidden": false
}
]
