Advertisement
Guest User

Untitled

a guest
Nov 21st, 2014
168
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 2.60 KB | None | 0 0
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta http-equiv="X-UA-Compatible" content="IE=edge">
  5. <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
  6. </head>
  7.  
  8. <body>
  9.  
  10. <label for="opt1"><input class="radio-button-selector" type="radio" name="account" id="opt1" value="opt1">Opt1</label>
  11. <label for="opt2"><input class="radio-button-selector" type="radio" name="account" id="opt2" value="opt2">Opt2</label>
  12.  
  13. <div id="form_select" class="form-group">
  14. <select id="term" name="term" class="form-control">
  15. <option value="0">Please select</option>
  16. <option value="6">6 months</option>
  17. <option value="9">9 months</option>
  18. <option value="10">10 months</option>
  19. <option value="12">12 months</option>
  20. <option value="18">18 months</option>
  21. <option value="24">24 months</option>
  22. <option value="30">30 months</option>
  23. <option value="36">36 months</option>
  24. <option value="42">42 months</option>
  25. <option value="48">48 months</option>
  26. </select>
  27. </div>
  28.  
  29. <script type="text/javascript">
  30. if (window.jQuery) {
  31. // jQuery is available.
  32. }
  33. else { console.log("-- no jquery --"); }
  34. </script>
  35.  
  36. <script type="text/javascript">
  37. $(document).ready(function() {
  38. $("input.radio-button-selector").change(function(){
  39. console.log("Changed.");
  40. if ( $(this).val() == "opt2" ) {
  41. $("#term option[value='48']").hide();
  42. $("#term option[value='42']").hide();
  43. }
  44. else if ( $(this).val() == "opt1" ) {
  45. $("#term option[value='48']").show();
  46. $("#term option[value='42']").show();
  47. }
  48. });
  49. });
  50. </script>
  51. </body>
  52. </html>
  53.  
  54. $(document).ready(function() {
  55. var monthsDifference = $("#term option[value='48'], #term option[value='42']");
  56.  
  57. $("input.radio-button-selector").change(function(){
  58. if ( $(this).val() == "opt2" ) {
  59. monthsDifference.hide();
  60. }
  61. else if ( $(this).val() == "opt1" ) {
  62. monthsDifference.show();
  63. }
  64. });
  65. });
  66.  
  67. $(document).ready(function() {
  68. var optionMonths = {
  69. opt1: [6,9,10,12,18,24,30,36,42,48],
  70. opt2: [6,9,10,12,18,24,30,36]
  71. }
  72. //Cache all options
  73. var $options = $("#term option");
  74.  
  75. $("input.radio-button-selector").change(function(){
  76. //Hide all options first
  77. $options.hide();
  78. //Then show relevant options
  79. showOptionMonths( optionMonths[ $(this).val()] );
  80. });
  81. });
  82.  
  83. function showOptionMonths( months ){
  84. months.forEach( function( month ){
  85. $("#term option[value='" + month + "']").show();
  86. });
  87. }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement