javascript - If clicked on LI, the input radio inside li should checked -



javascript - If clicked on LI, the input radio inside li should checked -

i have multiple li , in li having input radio, , on clicking on li show different info @ right side, info showing problem is- want is,if have clicked on li want add together "checked" property input within li. if have clicked on li , "checked" property remove previous radio box , add together respective radio box within clicked li

my html code sample:

<ul class="list-unstyled"> <li id="allroles" onclick="" class="user-roles"> <ul class="list-unstyled"> <li id="allroles" onclick="" class="user-roles"> <div class="grprow"> <span class="radio-placeholder"> <input type="radio" name="userrole" value="6" id="6" style="display:none"></span> <span>admin</span><br> </div> </li> <li id="allroles" onclick="" class="user-roles"> <div class="grprow"> <span class="radio-placeholder"> <input type="radio" name="userrole" value="6" id="6" style="display:none"></span> <span>admin</span><br> </div> </li> <li id="allroles" onclick="" class="user-roles"> <div class="grprow"> <span class="radio-placeholder"> <input type="radio" name="userrole" value="6" id="6" style="display:none"></span> <span>admin</span><br> </div> </li> <li id="allroles" onclick="" class="user-roles"> <div class="grprow"> <span class="radio-placeholder"> <input type="radio" name="userrole" value="6" id="6" style="display:none"></span> <span>admin</span><br> </div> </li> </ul> <div class="grprow"> <span class="radio-placeholder"> <input type="radio" name="userrole" value="6" id="6" style="display:none"></span> <span>admin</span><br> </div> </li> <li id="allroles" onclick="" class="user-roles"> <div class="grprow"> <span class="radio-placeholder"> <input type="radio" name="userrole" value="6" id="6" style="display:none"></span> <span>admin</span><br> </div> </li> <li id="allroles" onclick="" class="user-roles"> <div class="grprow"> <span class="radio-placeholder"> <input type="radio" name="userrole" value="6" id="6" style="display:none"></span> <span>admin</span><br> </div> </li> <li id="allroles" onclick="" class="user-roles"> <div class="grprow"> <span class="radio-placeholder"> <input type="radio" name="userrole" value="6" id="6" style="display:none"></span> <span>admin</span><br> </div> </li> </ul>

following script:

$(".list-unstyled li").each(function(){ if($(this).hasclass("active")){ $(".active .radio-placeholder input").attr("checked","checked"); } else{ $(".active .radio-placeholder input").each(function(){ if(!$(this).parents("li").hasclass('active')){ $(this).removeattr("checked","checked"); } }); } });

please guide me possible.

try this:

$(".list-unstyled > li").click(function(){ $(".list-unstyled > li").find('input[type="radio"]').removeattr('checked'); $(this).find('input[type="radio"]').attr('checked','checked'); });

pls prepare html, remove multiple uses of same id, nestings , end of tags.

javascript jquery

Comments

Popular posts from this blog

assembly - What is the addressing mode for ld, add, and rjmp instructions? -

vowpalwabbit - Interpreting Vowpal Wabbit results: Why are some lines appended by "h"? -

Is there a way to convert an HTML page styled with Bootstrap CSS into email-compatible html? -