#Multiple images in an Input Label?

1 messages · Page 1 of 1 (latest)

upbeat pebble
#

I'd like to have the first line of an input() display a row of the selected token images (preferably with their names beneath them). Is this possible?

visual tundra
#

Yes. Just use html like a table or <div>.

#

Unless you want each one selectable, then use radio with H attribute.

#

Can't really do it with checkbox for input() but html5 could work.

upbeat pebble
# visual tundra Can't really do it with checkbox for input() but html5 could work.

I just want to display the selected token images at the top of the input in a LABEL. Building a html table isn't working for me.... ```[h: mapID = getCurrentMapID()]

[h: tdData = ""]
[h, FOREACH(tokenID, getSelected()), CODE:
{
[h: tokenImage = strformat('<img src="%s" />', getTokenImage(50, tokenID, mapID))]
[h: tdData = tdData + "<td align=center>"+tokenImage+"<br>"+getName(tokenID, mapID)+"</td>"]
}
]

[h: tokenTable = "<html><table><tr>"+tdData+"</tr></table></html>"]

[h: status = input(
"selectedToken|"+tokenTable+"|| LABEL | SPAN=TRUE"
)
]
[h: abort(status)]```

visual tundra
#

I think I recall some wonkiness with images in labels. Try putting the html 3rd field and use Text=false.

# 
[h: mapID = getCurrentMapID()]

[h: tdData = ""]
[h, FOREACH(tokenID, getSelected()), CODE:
    {
        [h: tokenImage = strformat('<img src="%s" />', getTokenImage(50, tokenID, mapID))]
        [h: tdData = tdData + "<td align=center>"+tokenImage+"<br>"+getName(tokenID, mapID)+"</td>"]
    }
]

[h: tokenTable = "<html><table><tr>"+tdData+"</tr></table></html></html>"]

[h: status = input(
    "selectedToken||"+tokenTable+"| LABEL | TEXT=FALSE"
    )
]
[h: abort(status)]```
Better yet, toss in an extra </html> to remove the :
upbeat pebble
#

Interesting. I figured there were some tricks to get it working. Thanks.

livid ore
#

Is there a way to have horizontal checkbox's or do they only go vertical?

    "vchk_A|0|test A|CHECK",
    "vchk_B|0|test B|CHECK|SPAN=TRUE",
    "vchk_C|0|test C|CHECK|SPAN=TRUE")]
[h: abort(status)]```
I'd like if all check boxes were on the same *row*
image.png
upbeat pebble
#

Could put in a freq... but it doesn't seem like anyone wants to touch input. We need an input5! 😉

livid ore
#

Along the same lines and the same folks that would probably know . . . (i think this is a NO) but is there a trick to move the drop downs in this image over and up to the right (ala my arrow 🙂 )?

image.png
cedar bolt
#

I think you're looking for a Column Break.
My HTML knowledge is largely research-based, so I'll see if I can find the right tag.

...looks like it's controlled from the variou 'column' properties of the element:
https://www.w3schools.com/css/css3_multiple_columns.asp

W3Schools offers free online tutorials, references and exercises in all the major languages of the web. Covering popular subjects like HTML, CSS, JavaScript, Python, SQL, Java, and many, many more.

visual tundra
#

With input you could potentially right justify the dropdowns and if you make the radio horizontal it may look more natural.

rancid egret
#

Let's just say that input() is very ... functional... but unfortunately not very aesthetic...