PlutoUI.jl icon indicating copy to clipboard operation
PlutoUI.jl copied to clipboard

Input Labels

Open alecloudenback opened this issue 5 years ago • 4 comments

It would be nice to pass a label to the input so that you don't need to use a different cell to display the value. Maybe as an optional keyword arg?

Something like:

@bind balloons Slider(1:100; label = "Number of Balloons")

?

alecloudenback avatar Sep 07 '20 13:09 alecloudenback

I might be able to tackle this if the API/idea is supported. I think the changes would be straightforward:

  • Update structs to include a label field (nothing would be default)
  • Update the HTML to include a compatible label

alecloudenback avatar Sep 07 '20 13:09 alecloudenback

Related question though:

Using the form <label> element causes the variable not to bind: image

But this works: image

Should the former work?

alecloudenback avatar Sep 07 '20 13:09 alecloudenback

@bind takes the .value and input events of the first element, but <label> doesn't have those. You need to wrap it in a <span> and include a script that relays the events

fonsp avatar Sep 07 '20 14:09 fonsp

Mind that you can do

md"Number of balloons $(@bind x Slider(1:100))"

The only difference is that this doesn't create a <label> with the for attribute set, which would allow you to click on the label to check/uncheck a checkbox, for example. Also helps a bit with screen readers

fonsp avatar Sep 07 '20 14:09 fonsp