Hi I need some help here,
I have 2 checkboxlist which the 2 checkboxlist items are populated using a stored procedure. However I added a "Select All" list item to the checkbox list.
How can I expand my code to disable certain checkbox items in checkboxlist2 if a specific list item from checkboxlist1 is checked?
Taking the below as an example scenario:
e.g in checkboxlist1 there is colours, food and drinks populated with the select all as well and in checkboxlist2 there is red, blue, green, chicken, spinach, coke and juice populated.
If I checked only drinks in checkboxlist1 so it should only enable coke and juice which the rest of the list items should be disabled in checkboxlist2, lets say I add to checked 'Food' it should enable Chicken and spinach in in checkboxlist2 which means coke, juice, chicken and spinach will be enabled when I checked both.
Currently my code is only able to disable its own checkbox list items when "Select All" is checked. (lets say when I check "Select All" in checkboxlist1 it should disable the rest of the other checkboxes immediately other than "Select All" in checkboxlist1 and When I uncheck "Select All" it will enable all the other checkboxes again in checkboxlist1.)
<asp:CheckBoxList ID="Checkboxlist1" runat="server" Height="80px" Width="500px" AppendDataBoundItems="True" ViewStateMode="Enabled">
<asp:ListItem Text="Select All" Value="Select All"></asp:ListItem>
</asp:CheckBoxList>
<asp:CheckBoxList ID="Checkboxlist2" runat="server" Height="80px" Width="500px" AppendDataBoundItems="True" ViewStateMode="Enabled">
<asp:ListItem Text="Select All" Value="Select All"></asp:ListItem>
</asp:CheckBoxList>
$(function () {
$("#Checkboxlist1 :checkbox").change(function () {
$("#Checkboxlist1 :checkbox").click(function () {
var ischecked = $(this).is(":checked");
var val = $(this).val();
//alert(val);
if (val == "Select All") {
if (ischecked) {
$("#Checkboxlist1 :checkbox").attr('disabled', 'disabled');
$(this).removeAttr('disabled');
$("#Checkboxlist1 :checkbox").prop("checked", false);
$(this).prop("checked", true);
return;
} else {
$("#Checkboxlist1 :checkbox").removeAttr('disabled');
return;
}
}
});
});
})
$(function () {
$("#Checkboxlist2 :checkbox").change(function () {
$("#Checkboxlist2 :checkbox").click(function () {
var ischecked = $(this).is(":checked");
var val = $(this).val();
//alert(val);
if (val == "Select All") {
if (ischecked) {
$("#Checkboxlist2 :checkbox").attr('disabled', 'disabled');
$(this).removeAttr('disabled');
$("#Checkboxlist2 :checkbox").prop("checked", false);
$(this).prop("checked", true);
return;
} else {
$("#Checkboxlist2 :checkbox").removeAttr('disabled');
return;
}
}
});
});
})
Aucun commentaire:
Enregistrer un commentaire