Как отобразить скрытое поле флажка на странице JSP на основе определенного значения, выбранного из раскрывающегося списка в Framework Struts 1.3?

Question

Я хочу создать флажок в Struts 1.3 framework с помощью Nested Tags, Javascript и т.д., которые должны отображаться только тогда, когда пользователь выбирает конкретное значение из выбранного dropdown и значение checkbox должно получить сброс, когда пользователь выбирает другие значения из dropdown.

Answer 1

Как не писал код, мне удалось это мой собственный, попытался дать ответ

jsFiddle

$(document).ready(function() { 
 
    $(function() { 
 
     $("#id-select").change(function(){ 
 
      \t var $this = $(this); 
 
      $('input[type=checkbox]').each(function(){ 
 
      \t if($(this).val() == $this.val()) { 
 
       \t 
 
       $(this).parent().siblings().css('display', 'none'); 
 
       \t $(this).parent().css('display', 'block'); 
 
       
 
       \t $('input[type=checkbox]').css('display', 'none'); 
 
       \t $(this).css('display', 'block'); 
 
       } 
 
      }) 
 
      }); 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<select id='id-select'> 
 
    <option value="">Select</option> 
 
    <option value="volvo">Volvo</option> 
 
    <option value="saab">Saab</option> 
 
    <option value="opel">Opel</option> 
 
    <option value="audi">Audi</option> 
 
</select> 
 
<br> 
 
<div> 
 

 
<label for="volvo" style='display:none;'> 
 
    <input type="checkbox" id="volvo" value="volvo" style='display:none;'> 
 
volvo</label> 
 

 
<label for="saab" style='display:none;'> 
 
    <input type="checkbox" id="saab" value="saab" style='display:none;'> saab</label> 
 
    
 
<label for="opel" style='display:none;'> 
 
    <input type="checkbox" id="opel" value="opel" style='display:none;'> opel</label> 
 
    
 
<label for="audi" style='display:none;'> 
 
<input type="checkbox" id="audi" value="audi" style='display:none;'> 
 
audi</label> 
 

 
</div>

UPDATE использованием JavaScript
Здравствуйте @Arvind У меня есть изменил эту работу с JavaScript,
Может быть много улучшения, необходимого, я не код в JavaScript

function showCheckBox($this) { 
 
\t var cols = document.getElementsByClassName('class-label'); 
 
    for(i=0; i<cols.length; i++) { 
 
     cols[i].style.display = 'none'; 
 
    } 
 
    var cols = document.getElementsByClassName('class-cb'); 
 
    for(i=0; i<cols.length; i++) { 
 
     cols[i].style.display = 'none'; 
 
     cols[i].checked = false; 
 
    } 
 
\t var array = document.getElementsByTagName("input"); 
 
    for(var ii = 0; ii < array.length; ii++) 
 
    { 
 
    if(array[ii].type == "checkbox") 
 
    { 
 
     if(array[ii].value == $this.value) 
 
     { 
 
      array[ii].style.display = 'block'; 
 
      array[ii].parentElement.style.display = 'block'; 
 
     } 
 
    } 
 
    } 
 
}

<select id='id-select' onchange="showCheckBox(this);"> 
 
    <option value="">Select</option> 
 
    <option value="volvo">Volvo</option> 
 
    <option value="saab">Saab</option> 
 
    <option value="opel">Opel</option> 
 
    <option value="audi">Audi</option> 
 
    <option value="option1">option1</option> 
 
    <option value="option2">option2</option> 
 
</select> 
 

 
<div> 
 

 
<label for="volvo" class='class-label' style='display:none;'> 
 
    <input type="checkbox" class='class-cb' id="volvo" value="volvo" style='display:none;'>volvo 
 
</label> 
 

 
<label for="saab" class='class-label' style='display:none;'> 
 
    <input type="checkbox" class='class-cb' id="saab" value="saab" style='display:none;'> saab 
 
</label> 
 
    
 
<label for="opel" class='class-label' style='display:none;'> 
 
    <input type="checkbox" class='class-cb' id="opel" value="opel" style='display:none;'>opel 
 
</label> 
 
    
 
<label for="audi" class='class-label' style='display:none;'> 
 
    <input type="checkbox" class='class-cb' id="audi" value="audi" style='display:none;'>audi 
 
</label> 
 

 
</div>

Answer 2

function showCheckBox($this) { 
 
\t var cols = document.getElementsByClassName('class-label'); 
 
    for(i=0; i<cols.length; i++) { 
 
     cols[i].style.display = 'none'; 
 
    } 
 
    var cols = document.getElementsByClassName('class-cb'); 
 
    for(i=0; i<cols.length; i++) { 
 
     cols[i].style.display = 'none'; 
 
    } 
 
\t var array = document.getElementsByTagName("input"); 
 
    for(var ii = 0; ii < array.length; ii++) 
 
    { 
 
    if(array[ii].type == "checkbox") 
 
    { 
 
     if(array[ii].value == $this.value) 
 
     { 
 
      array[ii].style.display = 'block'; 
 
      document.getElementById("volvo").checked = false; 
 
      array[ii].parentElement.style.display = 'block'; 
 
     } 
 
    } 
 
    } 
 
}

<select id='id-select' onchange="showCheckBox(this);"> 
 
    <option value="">Select</option> 
 
    <option value="volvo">Volvo</option> 
 
    <option value="saab">Saab</option> 
 
    <option value="opel">Opel</option> 
 
    <option value="audi">Audi</option> 
 
</select> 
 
<div> 
 

 
<label for="volvo" class='class-label' style='display:none;'> 
 
    <input type="checkbox" class='class-cb' id="volvo" value="volvo" style='display:none;'>volvo 
 
</label> 
 

 
<label for="saab" class='class-label' style='display:none;'> 
 
    <input type="checkbox" class='class-cb' id="saab" value="saab" style='display:none;'> saab 
 
</label> 
 
    
 
<label for="opel" class='class-label' style='display:none;'> 
 
    <input type="checkbox" class='class-cb' id="opel" value="opel" style='display:none;'>opel 
 
</label> 
 
    
 
<label for="audi" class='class-label' style='display:none;'> 
 
    <input type="checkbox" class='class-cb' id="audi" value="audi" style='display:none;'>audi 
 
</label> 
 

 
</div>