Search jQuery

jQuery Forum

Screen name:
codinphp

codinphp's Profile

1 Posts

1 Responses

0 Followers

Activity Trend

Last 30 days

Loading Chart...

Show:

Expanded view
List view

How do you use .hide based on which radio button is clicked?
[2Replies]
- 23-Sep-2013 02:20 PM
- Forum: Using jQuery
I have the following html radio buttons and I am trying to hide a second set of radio buttons if yes is clicked and show the second set of radio buttons is no is clicked. Here is my code.
2. <!doctype html>
3. <html lang=en>
4. <head>
5. <meta charset=utf-8>
6. <title>My HTML 5 Page</title>
7. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.js" type="text/javascript"></script>
8. </head>
10. <body>
11. <form>
12. <div class="field-group see outer ">
13. <label for="AccountHolder" class="req">Account Holder:</label>
15. <div class="field inner">
16. <div class="radio" id="uniform-radio1"><span class="checked"><input type="radio" name="radAnswer" id="Yes" value="1" ></span></div>
17. <label for="Yes">Yes</label>
18. </div>
20. <div class="field">
21. <div class="radio" id="uniform-radio2"><span><input type="radio" name="radAnswer" id="No" value="2" ></span></div>
22. <label for="No">No</label>
23. </div>
24. </div>
26. <div class="field-group toggle2">
27. <label for="USCitizen" class="req">U.S. Citizen:</label>
29. <div class="field">
30. <div class="radio3" id="uniform-radio1"><span class="checked"><input type="radio" name="Yes" id="Yes" value="1"></span></div>
31. <label for="Yes">Yes</label>
32. </div>
34. <div class="field">
35. <div class="radio4" id="uniform-radio2"><span><input type="radio" name="No" id="No" value="2" ></span></div>
36. <label for="No">No</label>
37. </div>
38. </div>
39. </form>
40. <script>
41. $(document).ready(function() {
42. $(".radio").click(function() {
43. if($("input[type='radio']:checked").attr('id') == "uniform-radio1"){
44. $(".toggle2").hide();
45. }
46. else if($("input[type='radio']:checked").attr('id') == "uniform-radio2"){
47. $(".toggle2").show();
48. }
49. alert($(this).attr('id'));
50. });
51. });
52. </script>
54. </body>
56. </html>

«Prev
Next »

Response title

Attachments

jQuery Forum

Activity Trend