0

I would like a form with radio buttons with an underneath link of "more information" and, according to the selected button, to show this link more of the corresponding information.

Here is my code. But it doesn't work :-(

$(document).ready(function(){
  $("div").hide();
});

$(document).ready(function(){
  if($('input:radio[name="tarif"][value="jour"]').prop('checked', true)){
    $("button").click(function(){
        $(".jour").toggle();
    });
  } else if($('input:radio[name="tarif"][value="nuit"]').prop('checked', true)){
    $("button").click(function(){
        $(".nuit").toggle();
    });
  }
});
<INPUT type= "radio" name="tarif" value="jour"> tarif de jour
<INPUT type= "radio" name="tarif" value="nuit"> tarif de nuit
<a href=# class="info">More information</a>
<div class="jour">
  <p>
    qedaqteeteataeteteat
  </p>
</div>
<div class="nuit">
  <p>
    ZEFSZEFSGDHZEGSHGREZREGR
  </p>
</div>
<button>Toggle between hide() and show()</button>

Please, can you help me?

zx485
  • 28,498
  • 28
  • 50
  • 59
Simon Buerman
  • 1
  • 2
  • Would this solution be of any use? http://stackoverflow.com/questions/5940963/jquery-show-and-hide-divs-based-on-radio-button-click – Alex May 03 '16 at 16:12

1 Answers1

0

It's not very clear what are you trying to accomplish with that button, but assuming you just need the radio buttons to toggle a choice (showing a particular div or link depending on the user selection), this may work for you:

$(document).ready(function(){
    $("[name=tarif]").click(function() {
        $("div").hide(); // not very safe, you probably want to add a class to those divs
        $("."+$(this).val()).show();
   });
});
matteplus
  • 13
  • 5