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

Show/Hide Div on char sheet based on contents of Listbox

I have a list box defined as follows: <td class="sheet-table-header">Realm:</td> <td class="sheet-table-data-left"><select name="attr_realm" style="width: 100px"> <option value="Channeling" selected>Channeling</option> <option value="Essence">Essence</option> </select></td> I then have 2 columns of spells in repeating lists (3 lists per column) defined similar to as follows (one block of code per repeating list - 6 lists in total): <table> <input type="checkbox" class="sheet-pc-spell-oe-show sheet-arrow" title="spell-oe-show" name="attr_spell-oe-show" value="1" checked /><span></span> <td class="sheet-statlabel-big" style="width: 400px;">Open Essence</td> </table> <div id="spell-oe" class="sheet-pc-spell-oe"> <div class="sheet-table"> <div class="sheet-table-data-center" style="vertical-align:top;"> <div style="float: left"> <table> <tr class="sheet-table-header"> <td class="sheet-table-header2" style="width: 200px;">Spell List</td> <td class="sheet-table-header2" style="width: 53px;">Chance</td> </tr> </table> <fieldset class="repeating_spell-oe"> <table style="width: 203px;" class="sheet-table-row"> <tr> <td class="sheet-table-data-skills-cat-name"><select name=attr_spell-oe_name"> <option value="1">Essence Hand</option> <option value="2">Essence Perceptions</option> <option value="3">Essence's Ways</option> <option value="4">Illusions</option> <option value="5">Physical Enhancement</option> <option value="6">Spell Ways</option> <option value="7">Spirit Mastery</option> <option value="8">Unbarring Ways</option> <td class="sheet-table-data-skills-cat"><select name="attr_spell-oe_rank" style="width: 80px"> <option value="0" selected>0%</option> <option value="1" selected>20%</option> <option value="2">40%</option> <option value="3">60%</option> <option value="4">80%</option> <option value="5">Learned</option> </select> </td> </tr> </table> </fieldset> </div> </div> <div class="sheet-table-data-center" style="vertical-align:top;">   </div> </div> <hr/> </div> Depending upon whether the list box has Essence or Chaneling selected I want only 3 of the spell lists to be displayed. To do this I wrote the following function on("change:realm sheet:opened", function () { getAttrs(['realm'], function(values) { let realm_val= values.realm; if (realm_val == "Essence") { spell-oe.style.display='inline-block'; spell-mage.style.display='inline-block'; spell-bard.style.display='inline-block'; spell-och.style.display='none'; spell-animist.style.display='none'; spell-ranger.style.display='none'; } else if (realm_val == "Channeling") { spell-oe.style.display='none'; spell-mage.style.display='none'; spell-bard.style.display='none'; spell-och.style.display='inline-block'; spell-animist.style.display='inline-block'; spell-ranger.style.display='inline-block'; } else { spell-oe.style.display='none'; spell-mage.style.display='none'; spell-bard.style.display='none'; spell-och.style.display='none'; spell-animist.style.display='none'; spell-ranger.style.display='none'; } }); }); The function is either not firing, or not working as irrespective of the option selected in the list box I still get all 6 spell lists displayed. Please can you show me what I have done wrong? Thanks
1542330724
vÍnce
Pro
Sheet Author
AFAIK, sheetworkers cannot effect the DOM on roll20.  You'll have to use css only to hide/show elements.
1542331746
GiGs
Pro
Sheet Author
API Scripter
Vince is correct. CSS is the only way, and is covered in the CSS Wizardry page on the wiki.