如何激活下拉单击复选框[关闭]

Question

I am new in Laravel Framework and new in jquery.

i am facing one problem. i want by default all the selectboxes are disabled.It will be active only when click on Checkbox i.e. when user click on skin care checkbox its corresponding select box will active and when user click on Hair checkbox its corresponding select box will active. My html code as below:-

enter code here
<div class="div_img_part-2"> 
    <span class="img_part_class-2"><img src="img/skin-care-bbeauty-tip1.png"></span>
    <span class="text_part_class-2">
    <span class="check-box">
        <input type="checkbox" name="name"/>Skin Care</span>
    </span>
    <select class="selectpicker" >
        <option>Salon</option>
        <option>Mobile beautician</option>      
        <option>Both</option>
    </select>
 </div>

Note:- The above code later on i will implement through Foreach loop. So please provide me jquery code according to Foreach

Answer 1

Try this jQuery code. If you are using bootstrap selectpicker then use $('.selectpicker').selectpicker('refresh'); for refresh selectpicker so that take effect of disabled attrinute otherwise remove that line from code. See my fiddle here

$(document).ready(function () {
            $(".div_img_part-2 .selectpicker").attr("disabled",true);
            $('.selectpicker').selectpicker('refresh');
                $(".check-box input[type='checkbox']").on("change", function () {
                    if ($(this).prop("checked")) {
                        $(this).parents(".div_img_part-2").find(".selectpicker").removeAttr("disabled");
                        $('.selectpicker').selectpicker('refresh');
                    }else{
                        $(this).parents(".div_img_part-2").find(".selectpicker").attr("disabled",true);
                        $('.selectpicker').selectpicker('refresh');
                    }
                });
        });