only one checkbox selected at a time in jquery -


i working on popup window website makes choose between options before logging it. deal trying apply jquery, function "one checkbox selected @ time".

i tried lot of different possibilities reason doesn't work on code.

here code:

    <body>     <header>         <div class="titulo">             <img src="get_your.png" alt="">         </div>     </header>     <div class="container">         <article class="mf">             <div><img src="indetify.png" alt="" style="padding-    bottom:40px;"></div>             <div id="firstblock">                 <div class="male">                     <img src="sim_boy.png" alt=""><br>                     <input type="checkbox" id="chkbox100"      onclick="toggle(this);" class="input_class_checkbox"><br>                     <img src="male.png" alt="">                 </div>                 <div class="female">                     <img src="sim_girl.png" alt=""><br>                     <input type="checkbox" id="chkbox121"         onclick="toggle(this);" class="input_class_checkbox"><br>                     <img src="female.png" alt="" style="padding-   top:4px;">                 </div>             </div>         </article>         <aside class="all">             <div style="margin-left:60px;"><img src="like.png" alt="" style="padding-bottom:40px;"></div>             <div>                 <div class="all_one">                     <img src="sim_boy.png" alt=""><br>                      <input type="checkbox" class="input_class_checkbox"><br>                      <img src="male.png" alt="">                 </div>                 <div class="all_one">                     <img src="sim_girl.png" alt=""><br>                     <input type="checkbox" class="input_class_checkbox"><br>                     <img src="female.png" alt="" style="padding-top:4px;">                 </div>                 <div class="all_one">                     <img src="bi_mf.png" alt=""><br>                     <input type="checkbox"    class="input_class_checkbox"><br>                     <img src="both.png" alt="">                 </div>             </div>         </aside>       </div>      <footer>         <div class="button">             <img src="button1.png" alt="">         </div>     </footer>     <script>     $('.input_class_checkbox').each(function(){         $(this).hide().after('<div class="class_checkbox" />');      });      $('.class_checkbox').on('click',function(){                   $(this).toggleclass('checked').prev().prop('checked',$(this).is('.checked'))     });      </script>   </body> 

notice applied css checkbox , changed default ones others built. think problem,

.class_checkbox { width: 57px;   height: 57px; background-image:url(input.png);  } .class_checkbox.checked {     background-image:url(checked_c.png);     width:65px;     height:59px;  } 

because when try this

<body> <div> <input type="checkbox" class="example" /> <input type="checkbox" class="example" /> </div> <div> <input type="checkbox" class="example2" /> <input type="checkbox" class="example2" /> <input type="checkbox" class="example2" /> </div> </body> <script> $('input.example').on('change', function() { $('input.example').not(this).prop('checked', false);   }); $('input.example2').on('change', function() { $('input.example2').not(this).prop('checked', false);   });  </script> 

it works perfectly!!!! when apply code doesn't work , tried several codes...

use radio buttons instead. group selected groups "name":

  <input type="radio" name="example" value="male"> male<br>   <input type="radio" name="example" value="female"> female<br>   <input type="radio" name="example" value="other"> other    <input type="radio" name="example2" value="plane"> plane<br>   <input type="radio" name="example2" value="car"> car<br>   <input type="radio" name="example2" value="bus"> bus 

see: http://www.w3schools.com/html/tryit.asp?filename=tryhtml_radio

ps: radio buttons can styled checkboxes, if preferred layout...


Comments

Popular posts from this blog

java - pagination of xlsx file to XSSFworkbook using apache POI -

Unlimited choices in BASH case statement -

apache - How do I stop my index.php being run twice for every user -