Is it a true statement that I cannot put Inputs into a scrollable window within an app?
I've been unable to get it to work but thought there might be a workaround.
What do you mean with "scrollable window" (or what is your goal) and what have you tried that didn't work?
Reconstructing this from memory. I deleted it after I tried it and it didn't work.
paragraph ".scrolling-window {width: 98%; height: 200px; overflow-y: auto; overflow-x: hidden; border: 3px solid #000;}"
paragraph "
"
input (name: "lowTemperatureThreshold", type: "number", title: bold("Low Temperature Threshold"), required: true, displayDuringSetup: true, defaultValue: 60, submitOnChange: true, width: 2)
"
input (name: "lowTemperatureThreshold", type: "number", title: bold("Low Temperature Threshold"), required: true, displayDuringSetup: true, defaultValue: 60, submitOnChange: true, width: 2)
paragraph "
It would create the scrollable window but the input's would not be within the window, they would immediately follow it.
I have up to 10 lines of inputs and they take up a lot of screen space. If I could put them in a scrolling window it would make better use of the screen space and cleaner interface.
Have you considered the use of a collapsible section instead? (What you want might be possible, but I'm not familiar with the CSS or markup you might need to create it.)
I already have a collapsible section, however that is an all or nothing solution. What I wanted to do was be able to view a subset of the inputs so I could make more of the screen real estate.
I may be slightly missing the point here, but could the overflow-y: auto somehow causing you grief? Maybe try playing with that setting?
This is my code:
paragraph "<style>.scrollable{width: 100%; height: 300px;overflow-y: hidden; overflow-x: visible; border: 1px solid #ccc;padding:0}</style>"
paragraph "<div class=scrollable>My Content inside the window"
input (name: "X1", type: "enum", title: bold("myInput"), options: ["yes","no"], required:true, defaultValue: "no", submitOnChange: true, width: 2)
paragraph "</div>"
This is how it appears:
and this is how Chrome sees it:
Looks like it applied an automatic closure to the scrollable div.
Too bad. I've also tried to create side by side content and that is prohibited also as far as my testing goes. Normal HTML\CSS rules do not apply.
I suspect paragraph and input are constructs within Groovy / HE apps code, so once you specify another, i.e. the input, it automatically closes out the content inside the paragraph. I suspect you could include HTML tags for an input inside the DIV, but not sure how you would populate it with, say devices, and then get the value out.
I would expect you can define a TABLE tag and display things side by side that way, but again, am not expecting inputs could be included in that structure.
Yes, they have a table with checkboxes showing up in a few of the built in apps but no inputs that i gave seen. They are not HTML friendly.
