radio select all and select none not working properly in jquery 1.10.1 -
my issue happening in jquery 1.10.1. if utilize jquery 1.8.3, works fine. have list 'yes' , 'no' radio buttons, , 1 'select all' radio , 1 'select none' radio. made code list selects 'yes' radio buttons when click 'select all' radio, , same 'select none' radio. problem thatthis works 1 time each of these radio buttons. mean when sleect 'sselect all',radio works, select 'slelect none' radio, works, go 'select all' radio , not work.code here:
$(document).ready(function(){ $('.showme-btn').hover(function(){ $(this).next('.showme').fadetoggle(200); //$(this).parent('.show-outer').toggleclass("show-outer-color"); }); $("input.allradioselect").click(function(){ if($(this).is(':checked')){ $("ul[class*='eachfield'] input.yesradio").attr("checked","true"); } }); $("input.noradioselect").click(function(){ if($(this).attr('checked', true)){ //alert('ff'); $("ul[class*='eachfield'] input.noradio").attr("checked", "false"); } }); });
html:
<ul class="cb commongap" style="background-color: #fff; float: left; width: 99%;"> <li style="margin-left: 8px; width: 75%; float: right; text-align: right;"><img src="img/pointer.png" alt="pointer"/> mark questions : yes <input type="radio" class="allradioselect" name="slelectallorno"/> or no <input type="radio" class="noradioselect" name="slelectallorno"/> </li> </ul> <ul class="eachfield-title titlegap"> <li class="eachfield-title-numbering">a.</li> <li class="ques">have received medical treatment during lastly 5 years or awaiting medical or surgical consultation, hospitalization, test or investigation?<span class="showme-btn">?</span> <div class="showme"> (you need not disclose matters relating uncomplicated pregnancy, mutual colds, influenza, hay-fever or minor ailment requiring single consultation).(you need not disclose matters relating uncomplicated pregnancy, mutual colds, influenza, hay-fever or minor ailment requiring single consultation). </div> <div class="cb"></div> </li> <li class="yes-no"><input type="radio" class="yesradio" name="selecta"/> </li> <li class="yes-no"><input type="radio" class="noradio" name="selecta"/> </li> </ul> <ul class="eachfield-title titlegap"> <li class="eachfield-title-numbering">b.</li> <li class="ques"> have ever had medical or surgical treatment, including investigations, tests, scans or x-ray of next illnesses or medical conditions: <span class="showme-btn">?</span> <div class="showme"> (you need not disclose matters relating uncomplicated pregnancy, mutual colds, influenza, hay-fever or minor ailment requiring single consultation).(you need not disclose matters relating uncomplicated pregnancy, mutual colds, influenza, hay-fever or minor ailment requiring single consultation). </div> <div class="cb"></div> </li> <li class="yes-no"><input type="radio" class="yesradio" name="selectb"/> </li> <li class="yes-no"><input type="radio"class="noradio" name="selectb"/> </li> </ul>
fiddle here: http://jsfiddle.net/nvk6y/ can alter jquery version 1.8.3 in fiddle , see difference. in advance.
try:
$(document).ready(function () { $('.showme-btn').hover(function () { $(this).next('.showme').fadetoggle(200); //$(this).parent('.show-outer').toggleclass("show-outer-color"); }); $("input[name='slelectallorno']").click(function () { if ($(this).val() == 'all') { $("ul[class*='eachfield'] input.yesradio").prop("checked", true); } else { $("ul[class*='eachfield'] input.noradio").prop("checked", true); } }); });
jsfiddle example
jquery
No comments:
Post a Comment