选中/取消全选复选框
本文关键字:复选框 全选 取消 选中 | 更新日期: 2023-09-27 18:22:28
我有一个复选框列表,它从sql表中获取项目,并根据下拉菜单中的选择进行更改。我正在尝试在该列表中添加另一个复选框,该复选框充当选择/取消选择所有复选框。我在这个网站上看到了一些例子,但似乎没有什么是正确的。
预期功能:选择框后,将选择所有其他框。
如果取消选择框,则会选择所有其他框。
选中框后,如果另一个框未被选中,则全选框将被取消选中。
C#:
List<ListItem> toBeRemoved = new List<ListItem>();
//removes items when new item from dropdown is selected
for (int i = 1; i < CheckOpenTimesheets.Items.Count; i++)
{
toBeRemoved.Add(CheckOpenTimesheets.Items[i]);
}
for (int i = 0; i < toBeRemoved.Count; i++)
{
CheckOpenTimesheets.Items.Remove(toBeRemoved[i]);
}
lblOpenTimesheets.Text = "";
String sql = "sql statement here";
command.CommandText = sql;
command.Parameters.Add(new SqlParameter("userid", ddlActingAs.SelectedValue.ToString()));
SqlDataReader reader = command.ExecuteReader();
//Adds items to the checkboxlist
while (reader.Read())
{
ListItem item = new ListItem();
item.Text += reader.GetDateTime(0).ToString("MM/dd/yyyy") + " is open";
item.Value = reader["StartDate"].ToString();
CheckOpenTimesheets.Items.Add(item);
}
CheckOpenTimesheets.UpdateAfterCallBack = true;
reader.Close();
我尝试的选择/取消选择:
protected void select_DeselectAll(object sender, System.EventArgs e)
{
if (CheckOpenTimesheets.Items[0].Selected == true)
{
foreach (ListItem item in CheckOpenTimesheets.Items)
{
item.Selected = true;
}
}
else
{
foreach (ListItem item in CheckOpenTimesheets.Items)
{
item.Selected = false;
}
}
}
ASP:
<anthem:CheckBoxList ID="CheckOpenTimesheets" OnSelectedIndexChanged="select_DeselectAll" runat="server" AutoPostBack="true" >
<asp:ListItem Text="Select/Deselect All" />
</anthem:CheckBoxList>
编辑:问题似乎是当选择了select all以外的复选框时,OnSelectedIndexChanged事件会触发。
编辑2:使全选复选框与复选框列表分离。但是,在尝试实现以下功能时,如果在选中全选复选框时取消选中某个复选框,则会取消选中全选复选复选框,但其他所有复选框都不会"取消选择"。但这并没有发生,因为"全选"复选框事件会触发。
protected void chkAll_CheckedChanged(object sender, EventArgs e)
{
foreach (ListItem item in CheckOpenTimesheets.Items)
{
item.Selected = chkAll.Checked;
}
}
protected void checkbox_Selected(object sender, EventArgs e)
{
chkAll.CheckedChanged -= chkAll_CheckedChanged;
foreach (ListItem item in CheckOpenTimesheets.Items)
{
if ((item.Selected = false) && (chkAll.Checked = true))
{
chkAll.Checked = false;
}
}
}
听起来您理解您的问题。当您单击第一个复选框以外的任何其他复选框时,问题就会出现。如果第一个复选框没有选中,而您选中了另一个复选框,则您的逻辑会告诉所有其他复选框都不要选中,包括您刚刚选中的那个复选框。
一种选择是将"全选/取消全选"复选框从复选框列表中删除。让它成为自己的独立复选框。
<asp:CheckBox ID="chkAll" runat="server" Text="Select/Deselect All" OnCheckedChanged="chkAll_CheckedChanged" AutoPostBack="true" />
<anthem:CheckBoxList ID="checkOpenTimesheets" OnSelectedIndexChanged="checkOpenTimesheets_SelectedIndexChanged" runat="server" AutoPostBack="true" >
</anthem:CheckBoxList>
然后您的全选事件处理程序会将它们全部更改为相同的。
protected void chkAll_CheckedChanged(object sender, EventArgs e)
{
foreach(ListItem item in CheckOpenTimesheets.Items)
{
item.Selected = chkAll.Checked;
}
}
然后还内置了功能,您可以通过程序选择或取消选择复选框列表中的"全选/取消全选"复选框(如果有的话)更改为其他复选框之外的其他复选框。正如这个答案中所解释的,这里的关键是关闭全选复选框的CheckedChanged事件,否则该事件将如您所见触发。
protected void checkOpenTimesheets_SelectedIndexChanged(object sender, EventArgs e)
{
chkAll.CheckedChanged -= chkAll_CheckedChanged;
CheckBoxList checkOpenTimesheets = (CheckBoxList)sender;
if (allItemsCheckedInCheckBoxList(checkOpenTimesheets))
{
chkAll.Checked = true;
}
else if (allItemsUnCheckedInCheckBoxList(checkOpenTimesheets))
{
chkAll.Checked = false;
}
chkAll.CheckedChanged += chkAll_CheckedChanged;
}
private bool allItemsCheckedInCheckBoxList(CheckBoxList checkBoxList)
{
bool allItemsChecked = true;
foreach (ListItem item in checkBoxList.Items)
{
allItemsChecked = item.Selected;
if (!allItemsChecked)
break;
}
return allItemsChecked;
}
private bool allItemsUnCheckedInCheckBoxList(CheckBoxList checkBoxList)
{
bool allItemsUnChecked = false;
foreach (ListItem item in checkBoxList.Items)
{
allItemsUnChecked = item.Selected;
if (allItemsUnChecked)
break;
}
return allItemsUnChecked;
}