Description: While working on project I got the requirement to implement a feature to shortlist the eligible participants from all candidates. There were many other ways to do so but I decided to fill all the candidates in one checkboxlist and provided the option to select any or all participants from that. Similarly we can remove all or any of the selected participants as shown in demo image above.
Implementation: Let’s create a demo page to demonstrate the concept.
HTML Source Code
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<fieldset style="width: 400px;">
<legend>Add/Remove Items from One CheckBoxList to other</legend>
<table style="width: 400px">
<tr>
<asp:CheckBoxList ID="cbParticipants" runat="server">
<asp:ListItem Text="Aryan" Value="1"></asp:ListItem>
<asp:ListItem Text="Mayank" Value="2"></asp:ListItem>
<asp:ListItem Text="Anjan" Value="3"></asp:ListItem>
<asp:ListItem Text="Ankita" Value="4"></asp:ListItem>
<asp:ListItem Text="Nikita" Value="5"></asp:ListItem>
<asp:ListItem Text="Abha" Value="6"></asp:ListItem>
</asp:CheckBoxList></td>
<td style="text-align: center;">
<asp:Button ID="btnAdd" Width="120px" runat="server" Text="Add Selected" OnClick="btnAdd_Click" /><br />
<asp:Button ID="btnAddAll" Width="120px" runat="server" Text="Add All" OnClick="btnAddAll_Click" /><br />
<asp:Button ID="btnRemove" Width="120px" runat="server" Text="Remove Selected"OnClick="btnRemove_Click" /><br />
<asp:Button ID="btnRemoveAll" Width="120px" runat="server" Text="Remove All"OnClick="btnRemoveAll_Click" /></td>
<td style="background-color:#3b5998; color:#ffffff;vertical-align: top;">Selected Participants
<asp:CheckBoxList ID="cbSelectedParticipants" runat="server">
</asp:CheckBoxList>
</td>
</tr>
<tr><td style="text-align:center;" colspan="3"><asp:Label ID="lblMsg" ForeColor="Red" runat="server"></asp:Label></td></tr>
</table>
</fieldset>
</ContentTemplate>
</asp:UpdatePanel>
</div>
</form>
</body>
</html>
Asp.Net C# Code to add or remove items from one checkboxlist to other
protected void btnAdd_Click(object sender, EventArgs e)
{
//Check if any participant selected to add or not
if (cbParticipants.SelectedIndex >= 0)
{
lblMsg.Text = String.Empty;
//Loop through each item of checkboxlist
foreach (ListItem item in cbParticipants.Items)
{
//check if item selected
if (item.Selected)
{
// Add participant to the selected list if not alreay added
if (!IsParticipantExists(item.Value))
{
cbSelectedParticipants.Items.Add(item);
}
}
}
//Uncheck all selected items
cbParticipants.ClearSelection();
}
else
{
lblMsg.Text = "Please select at least one participant to add";
}
}
private bool IsParticipantExists(string val)
{
bool exists = false;
//Loop through each item in selected participant checkboxlist
foreach (ListItem item in cbSelectedParticipants.Items)
{
//Check if item selected already exists in the selected participant checboxlist or not
if (item.Value == val)
{
exists = true;
break;
}
}
return exists;
}
protected void btnAddAll_Click(object sender, EventArgs e)
{
lblMsg.Text = String.Empty;
//Remove all existing items from checkboxlist
cbSelectedParticipants.Items.Clear();
//Loop through all items of first checkboxlist and add in other checkboxlist
foreach (ListItem item in cbParticipants.Items)
{
cbParticipants.ClearSelection();
cbSelectedParticipants.Items.Add(item);
}
}
protected void btnRemove_Click(object sender, EventArgs e)
{
// Check if there are items in the checkboxlist or not
if (cbSelectedParticipants.Items.Count > 0)
{
//Check if any participant selected to remove or not
if (cbSelectedParticipants.SelectedIndex >= 0)
{
lblMsg.Text = String.Empty;
//Loop through each item in checkboxlist
for (int i = cbSelectedParticipants.Items.Count - 1; i >= 0; i--)
{
//Check if item selected
if (cbSelectedParticipants.Items[i].Selected)
{
//remove the selected item
cbSelectedParticipants.Items.RemoveAt(i);
}
}
}
else
{
lblMsg.Text = "Please select at least one participant to remove";
}
}
else
{
lblMsg.Text = "No participant(s) to remove";
}
}
protected void btnRemoveAll_Click(object sender, EventArgs e)
{
// Check if there are items in the checkboxlist or not
if (cbSelectedParticipants.Items.Count > 0)
{
lblMsg.Text = String.Empty;
//Remove all items from checkboxlist
cbSelectedParticipants.Items.Clear();
}
else
{
lblMsg.Text = "No participant(s) to remove";
}
}
0 comments:
Post a Comment
Note: only a member of this blog may post a comment.