how to enable and disable a dropdown list based on whether a radio button is checked or not through jstl in jsp

Question

In jsp page I have two radio button,if I check a radio button then one dropdown list should be enabled and if I select another radio button then another drop down list should be enabled and first dropdown list should be disabled.If none of the radio buttons are selected then both the drop down should be disbaled. How to do it using or tags of jstl.I tried in thsi way,but no results

<b>Select Status</b>
<p><input type="radio" name="val" value="Filling" id="Filling"> Filling</p>
<p><input type="radio" name="val" value="Stored" id="stored"> Stored</p>
<c:choose>
<c:when test="${Filling}">
Select Reference:
<select name="ref_logtime" >
<option value="Select">Select</option>
<c:forEach var="aff" items="${obj.connect()}">
<option value="${aff.value}">${aff.key} ${aff.value}</option>
</c:forEach>
</select>
</c:when>
<c:otherwise>
Select Reference:
<select name="ref_logtime" >
<option value="Select">Select</option>
<c:forEach var="aff" items="${obj.connect()}">
<option value="${aff.value}">${aff.key} ${aff.value}</option>
</c:forEach>
</select>
</c:otherwise>
</c:choose>

EDIT- How to do it through javascript ,if it can't be done with jstl.

<script type="text/javascript">

$(document).ready(function(){
    $('input[name="val"]').click(function() {
       if($('input[name="val"]').is(':checked')) { 
           var radioValue = $("input[name='val']:checked").val();
            if(radioValue == "Filling"){
               $( "#Fill" ).prop( "disabled", false );
               $( "#stored" ).prop( "disabled", true );
            } else {
                $( "#Fill" ).prop( "disabled", true );
               $( "#stored" ).prop( "disabled", false );
            }
       }
    });
    });
</script>
</head>

</head>

<body>
<jsp:useBean id="obj"  class="ref_Database.Refernce_Database" />


<form method="post" action="All_Mps.jsp">
<b>Select Status</b>
<p><input type="radio" name="val" value="Filling" id="Filling"> Filling</p>
<p><input type="radio" name="val" value="Stored" id="stored"> Stored</p>


Select Reference:
<select name="ref_fill" id="Fill" disabled="disabled" >
<option value="Select">Select</option>
<c:forEach var="aff" items="${obj.connect()}">
<option value="${aff.value}">${aff.key} ${aff.value}</option>
</c:forEach>
</select>

Select Reference:
<select name="ref_stored" id="stored" disabled="disabled" >
<option value="Select">Select</option>
<c:forEach var="aff" items="${obj.connect()}">
<option value="${aff.value}">${aff.key} ${aff.value}</option>
</c:forEach>
</select>

<br><br>
<b>Select Date to be compared</b><br>
<p>

Answer 1

In HTML use like this,

<input type="radio" name="gender" value="m" />Male
<input type="radio" name="gender" value="f" />Female
<br />
<select id="mOptions" disabled="true">
    <option>Select</option>
    <option value="1">Shirt</option>
    <option value="2">Pant</option>
    <option value="3">dhoti</option>
</select>

<select id="fOptions" disabled="true">
    <option>Select</option>
    <option value="4">Saree</option>
    <option value="5">Bangle</option>
   <option value="6">handbag</option>
</select>

And in scripting i have used the jQuery library,

$(document).ready(function(){
$('input[name="gender"]').click(function() {
   if($('input[name="gender"]').is(':checked')) { 
       var radioValue = $("input[name='gender']:checked").val();
        if(radioValue == "m"){
           $( "#mOptions" ).prop( "disabled", false );
           $( "#fOptions" ).prop( "disabled", true );
        } else {
            $( "#mOptions" ).prop( "disabled", true );
           $( "#fOptions" ).prop( "disabled", false );
        }
   }
});
});

Please find the working FIDDLE with this link

how to enable and disable a dropdown list based on whether a radio button is checked or not through jstl in jsp

Question

1 answers

solution1
1 ACCPTED 2015-03-25 05:18:01

how to enable and disable a dropdown list based on whether a radio button is checked or not through jstl in jsp

Question

1 answers

solution1 1 ACCPTED 2015-03-25 05:18:01

solution1
1 ACCPTED 2015-03-25 05:18:01