Roll20 uses cookies to improve your experience on our site. Cookies enable you to enjoy certain features, social sharing functionality, and tailor message and display ads to your interests on our site and others. They also help us understand how our site is being used. By continuing to use our site, you consent to our use of cookies. Update your cookie preferences .
×
Create a free account

Variable name for select value?

Hey everyone! I'd like some input on having a variable as the selection name on a drop-down menu. Essentially, I have a box that a player can fill in like "Fire magic" and when they create a new ability they will be able to choose what stat the ability will be rolling for using a drop-down box. Rather than having "Custom_Stat1" show up as an alternative I'd like the "Fire magic" to show up instead, so the players don't have to remember the order of their stats by heart. Is there any way to do this?
1530725749
GiGs
Pro
Sheet Author
API Scripter
I dont believe this is possible.
1530728781
Scott C.
Forum Champion
Sheet Author
API Scripter
Compendium Curator
Assuming that your custom skills aren't repeating items, you could do this as a pseudo select with some :hover detection and conditional display of elements. It'd be quite a bit of code, and not necessarily beautiful. The other option is to use a text entry input and then sheet workers to parse that and match it to skill names.
1530728940
GiGs
Pro
Sheet Author
API Scripter
Stellan is talking about user created names, that dont exist anywhere in the html of the code.  I don't think you can process such entries to have them be displayed in a roll2o select dropdown. If I'm wrong, I'd love to be shown how to do it, because I want that on my sheet too.
1530731593
Jakob
Sheet Author
API Scripter
Scott C. said: Assuming that your custom skills aren't repeating items, you could do this as a pseudo select with some :hover detection and conditional display of elements. It'd be quite a bit of code, and not necessarily beautiful. The other option is to use a text entry input and then sheet workers to parse that and match it to skill names. You can even do this type of thing with repeating items! But yes, it's a lot of code and the behaviour can be a bit weird compared to normal selects.
1530732400
GiGs
Pro
Sheet Author
API Scripter
Can you post some sample code that would achieve this effect?
1530732464

Edited 1530732638
Scott C.
Forum Champion
Sheet Author
API Scripter
Compendium Curator
GG, That's why I called it a pseudo select. Here's what the technique looks like (with very little in the way of styling): HTML <div class='pseudo-select-test'> <span>Acrobatics</span> <input type='number' name='attr_acrobatics' value='0'> <span>Athletics</span> <input type='number' name='attr_athletics' value='0'> <input type='text' name='attr_custom_skill_1_name' value='Custom Skill 1'><input type='number' name='attr_custom_skill_1' value='0'> <input type='text' name='attr_custom_skill_2_name' value='Custom Skill 2'><input type='number' name='attr_custom_skill_2' value='0'> <input type='text' name='attr_custom_skill_3_name' value='Custom Skill 3'><input type='number' name='attr_custom_skill_3' value='0'> <div class='pseudo-select'> <input class='select-filter' type='hidden' name='attr_pseudo_select' value='@{acrobatics}'> <label class='acrobatics'><input type='radio' name='attr_pseudo_select' value='@{acrobatics}' checked><span>Acrobatics</span></label> <label class='athletics'><input type='radio' name='attr_pseudo_select' value='@{athletics}'><span>Athletics</span></label> <label class='custom_skill_1'><input type='radio' name='attr_pseudo_select' value='@{custom_skill_1}'><input type='text' name='attr_custom_skill_1_name' value='Custom Skill 1'></label> <label class='custom_skill_2'><input type='radio' name='attr_pseudo_select' value='@{custom_skill_2}'><input type='text' name='attr_custom_skill_2_name' value='Custom Skill 2'></label> <label class='custom_skill_3'><input type='radio' name='attr_pseudo_select' value='@{custom_skill_3}'><input type='text' name='attr_custom_skill_3_name' value='Custom Skill 3'></label> </div> </div> CSS .sheet-pseudo-select-test{ display:grid; grid-template-columns:[selection-start]auto[selection-end] 1fr; grid-template-rows:repeat(5,1fr) [selection-start]auto[selection-end]; grid-gap:5px; } .sheet-pseudo-select{ display:grid; grid-template-columns:1fr; grid-area:selection; min-height:20px; outline:1px solid black; } .sheet-pseudo-select label{ position:relative; width:200px; display:none; } .sheet-pseudo-select:hover label, .sheet-pseudo-select .sheet-select-filter[value*="acrobatics"] ~ .sheet-acrobatics, .sheet-pseudo-select .sheet-select-filter[value*="athletics"] ~ .sheet-athletics, .sheet-pseudo-select .sheet-select-filter[value*="custom_skill_1"] ~ .sheet-custom_skill_1, .sheet-pseudo-select .sheet-select-filter[value*="custom_skill_2"] ~ .sheet-custom_skill_2, .sheet-pseudo-select .sheet-select-filter[value*="custom_skill_3"] ~ .sheet-custom_skill_3{ display:initial; } .sheet-pseudo-select label input[type=radio]{ z-index:2; opacity:0; position:absolute; } .sheet-pseudo-select label *{ width:100%; height:100%; display:block; } .sheet-pseudo-select input[type=text]{ z-index:-1; background:none; box-shadow:none; border:0px solid transparent; } .sheet-pseudo-select label input[type=radio]:checked + input, .sheet-pseudo-select label input[type=radio]:checked + span{ background-color:green!important; } Final Product (gif) Jakob, how would you do this with repeating items? EDIT: Note that I'm sure Jakob has a more elegant way to do this.
1530742848
GiGs
Pro
Sheet Author
API Scripter
Interesting! I'll have to explore this further.
1530773533
Jakob
Sheet Author
API Scripter
Jakob, how would you do this with repeating items? More or less the same as you, except that the radios become checkboxes, with radio-like behaviour enforced by sheet workers; showing/hiding needs to be handled per row, not with a global hidden input; I would use spans instead of text inputs within the labels (more than 1 input within a label is bad news anyway).
1530791489

Edited 1530791585
Scott C.
Forum Champion
Sheet Author
API Scripter
Compendium Curator
Ah, clever. And, yeah, if I was redoing it, I'd probably swap those labels for divs. I'm also unsure how to make this technique accessible for those using screen readers.