You'll need a sheetworker, but should be totally doable. Here's some theoretical code (may need to correct it): HTML <input class='div-show-input' name='attr_div_show_input' type='number'>
<input class='div-show-radio' name='attr_div_show_radio' type='radio' value='0' checked='checked'>
<input class='div-show-radio div-show-1' name='attr_div_show_radio' type='radio' value='1'>
<input class='div-show-radio div-show-2' name='attr_div_show_radio' type='radio' value='2'>
<input class='div-show-radio div-show-3' name='attr_div_show_radio' type='radio' value='3'>
<div class='conditional-div show-1'>
Content 1
</div>
<div class='conditional-div show-2'>
Content 2
</div>
<div class='conditional-div show-3'>
Content 3
</div> CSS .sheet-conditional-div,
.sheet-div-show-radio{
display:none;
}
.sheet-div-show-1:checked ~ .sheet-show-1{
display:initial;
}
.sheet-div-show-2:checked ~ .sheet-show-1,
.sheet-div-show-2:checked ~ .sheet-show-2{
display:initial;
}
.sheet-div-show-3:checked ~ .sheet-show-1,
.sheet-div-show-3:checked ~ .sheet-show-2,
.sheet-div-show-3:checked ~ .sheet-show-3{
display:initial;
} Sheetworker on('change:div_show_input',(event)=>{
getAttrs(['div_show_input'],(objs)=>{
let setObjs={};
setObj['div_show_radio']=Math.max(objs['div_show_input']*1||0,3);
setAttrs(setObj,{silent:true});
});
}); I've only done it out to 3 divs, but should be enough to get the idea. Edited for typos.
