Reputation: 25
I have a radio button list to select one of two services.
<table align="center" width="100%">
<tr>
<td colspan="2">
<input type="radio" name="selectedValue" value="serviceWise">
Service-Wise
<input type="radio" name="selectedValue" value="districtWise">
District-Wise
</td>
</tr>
</table>
<table>
<tr>
<td>
Service Name
</td>
</tr>
</table>
I need to display different rows for the two options. When Service-Wise is selected then Service name should be displayed and when District-Wise is selected then District name should be displayed. e.g. in the above code i have displayed Service name, but actully it should come only when Service-Wise option is selected. I am stuck only in the display part, thats why I have not mentioned any data retrival part in the code. I want to do it in the jsp page itself, Would really appreciate someone's help.
Upvotes: 1
Views: 1259
Reputation: 1207
Update: I forgot to put the # in front of the result IDs. Now it works.
It sounds like you need some JavaScript unless you plan on reloading your page whenever a radio button is selected.
I am using jQuery to simplify what you are looking for. In the tag of your JSP page add the following. It will link to the jQuery javascript file. It will also add a change listener on your radio buttons named 'selectedValue', allowing you to dynamically change the value in your table cell.
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("input[name='selectedValue']").change(function() {
if ($("input[name='selectedValue']:checked").val() == 'serviceWise')
$("#result").text("Service Name");
else if ($("input[name='selectedValue']:checked").val() == 'districtWise')
$("#result").text("something else");
});
});
</script>
Also update your table as shown below. I added the id attribute to easily reference the cell.
<table>
<tr>
<td id="result">
Service Name
</td>
</tr>
</table>
I used this answer (and some of it's code), so you may want to check it out: jQuery .change() on Radio Button
jsfiddle: http://jsfiddle.net/mikeyfreake/UUbxa/
Upvotes: 1