Показать и скрыть текстовую область при выбранном изменении опции

Question

Мне нужна текстовая область, которая должна отображаться только тогда, когда выбраны оба переключателя, как если бы я выбрал оба значения = 1 в первом случае, а значение = 2 во втором случае. В других случаях текстовая область должна исчезнуть. Надеюсь, кто-то может помочь. Благодарю.

<div class="row top-margin" id="remote"> 
 
\t \t \t \t \t <g:if test="${remote?.id == 1}"> 
 
<input type="radio" required name="remote" value="1" checked > <l:lookupLabe lookup="remote" id="1"/> 
 
<input type="radio" required name="remote" value="2" > <l:lookupLabel lookup="remote" id="2"/> 
 
\t \t \t \t \t </g:if> 
 
\t \t \t \t \t <g:elseif test="${remote?.id == 2}"> 
 
<input type="radio" required name="remote" value="1" > <l:lookupLabel lookup="remote" id="1"/> 
 
<input type="radio" required name="remote" value="2" checked > <l:lookupLabel lookup="remote" id="2"/> 
 
\t \t \t \t \t </g:elseif> 
 
\t \t \t \t \t <g:else> 
 
<input type="radio" required name="remote" value="1" > <l:lookupLabel lookup="remote" id="1"/> 
 
<input type="radio" required name="remote" value="2" > <l:lookupLabel lookup="remote" id="2"/> 
 
\t \t \t \t \t </g:else> 
 
</div> 
 
\t \t \t \t \t \t 
 

 
<div class="col-xs-12 col-sm-6" id="ref"> 
 
\t \t \t \t \t <g:if test="${ref?.id == 1}"> 
 
<input type="radio" required name="ref" value="1" checked > <g:message code="default.yes.label"/> 
 
<input type="radio" required name="ref" value="2" > <g:message code="default.no.label"/> 
 
\t \t \t \t \t </g:if> 
 
\t \t \t \t \t <g:elseif test="${ref?.id == 2}"> 
 
<input type="radio" required name="ref" value="1" > <g:message code="default.yes.label"/> 
 
<input type="radio" required name="ref" value="2" checked > <g:message code="default.no.label"/> 
 
\t \t \t \t \t </g:elseif> 
 
\t \t \t \t \t <g:else> 
 
<input type="radio" required name="ref" value="1" > <g:message code="default.yes.label"/> 
 
<input type="radio" required name="ref" value="2" > <g:message code="default.no.label"/> 
 
\t \t \t \t \t </g:else> 
 
</div> 
 
\t \t \t \t \t </div> \t \t \t \t 
 

 
<div id=divtext style='display:none'> <textarea id="txt1" name="title" > </textarea></div>

Answer 1

С JavaScrip вы могли бы сделать что-то вроде:

var radio1 = document.getElementsByName('ref1'); var radio2 = document.getElementsByName('ref2');

if (radios1.checked && radio2.checked) { 
    // do whatever you want with the checked radio 
    // in this case will be display the textarea 

    document.getElementById('txt1').style.display = 'block'; 
} 

Я надеюсь, что поможет.