Where we took two ListBoxes and their list item, we will put that list item inito each other list box.

Initial chamber

Step 1

Open your Visual Studio 2010 and create an Empty Website, provide a suitable name (listbox_demo).

Step 2

In Solution Explorer you get your empty website, then add two web forms and a SQL Server database as in the following.

For Web Form:

listbox_demo (your empty website) then right-click then select Add New Item -> Web Form. Name it listbox_demo.aspx.

Design chamber

Step 3

Now open your Listbox_demo.aspx file, where we create our design for our application.

Listbox_demo.aspx

  1. <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
  3. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  5. <html xmlns="http://www.w3.org/1999/xhtml">
  6. <head runat="server">
  7. <title></title>
  9. <style type="text/css">
  10. .style1
  11. {
  12. text-decoration: underline;
  13. font-size: large;
  14. color: #006600;
  15. }
  16. .style5
  17. {
  18. width: 69px;
  19. }
  20. .style6
  21. {
  22. width: 102px;
  23. }
  24. .style7
  25. {
  26. width: 238px;
  27. text-decoration: underline;
  28. color: #0000FF;
  29. }
  30. .style8
  31. {
  32. width: 102px;
  33. text-decoration: underline;
  34. color: #0000FF;
  35. }
  36. .style9
  37. {
  38. width: 238px;
  39. }
  40. .style10
  41. {
  42. width: 4px;
  43. }
  44. .style11
  45. {
  46. width: 4px;
  47. color: #0000FF;
  48. }
  49. </style>
  51. </head>
  52. <body id="nil">
  53. <form id="form1" runat="server">
  54. <div>
  56. <span class="style1"><strong>Move Data from one ListBox to other ListBox</strong></span><br />
  57. <br />
  58. <table style="width: 26%; height: 138px;">
  59. <tr>
  60. <td class="style8">
  61. <strong>ListBox1</strong></td>
  62. <td class="style11">
  63. </td>
  64. <td class="style7">
  65. <strong>ListBox2</strong></td>
  66. </tr>
  67. <tr>
  68. <td class="style6">
  70. <asp:ListBox ID="ListBox1" runat="server" Height="131px" Width="98px"
  71. SelectionMode="Multiple" BackColor="#66FF66">
  72. <asp:ListItem>Cricket</asp:ListItem>
  73. <asp:ListItem>Football</asp:ListItem>
  74. <asp:ListItem>Basketball</asp:ListItem>
  75. <asp:ListItem>Baseball</asp:ListItem>
  76. </asp:ListBox>
  77. </td>
  78. <td class="style10">
  79. <table style="width: 67%; height: 139px;">
  80. <tr>
  81. <td class="style5">
  82. <asp:ImageButton ID="ImageButton1" runat="server"
  83. ImageUrl="~/add 1on 1.jpg" onclick="ImageButton1_Click"
  84. ImageAlign="Bottom" />
  85. </td>
  86. </tr>
  87. <tr>
  88. <td class="style5">
  89. <asp:ImageButton ID="ImageButton2" runat="server"
  90. ImageUrl="~/remove 1 on 1.jpg" onclick="ImageButton2_Click" />
  91. </td>
  92. </tr>
  93. <tr>
  94. <td class="style5">
  95. <asp:ImageButton ID="ImageButton3" runat="server" ImageUrl="~/add all.jpg"
  96. onclick="ImageButton3_Click" />
  97. </td>
  98. </tr>
  99. <tr>
  100. <td class="style5">
  101. <asp:ImageButton ID="ImageButton4" runat="server" ImageUrl="~/remove all.jpg"
  102. onclick="ImageButton4_Click" />
  103. </td>
  104. </tr>
  105. </table>
  106. </td>
  107. <td class="style9">
  108. <asp:ListBox ID="ListBox2" runat="server" Height="131px" Width="98px"
  109. SelectionMode="Multiple" BackColor="#66FF66">
  110. <asp:ListItem>Volleyball</asp:ListItem>
  111. <asp:ListItem>Hockey</asp:ListItem>
  112. <asp:ListItem>Boxing</asp:ListItem>
  113. <asp:ListItem>Tennis</asp:ListItem>
  114. </asp:ListBox>
  115. </td>
  116. </tr>
  117. <tr>
  118. <td class="style6">
  119. </td>
  120. <td class="style10">
  121. <asp:Label ID="lbmsg" runat="server"></asp:Label>
  122. </td>
  123. <td class="style9">
  124. </td>
  125. </tr>
  126. </table>
  127. </div>
  128. </form>
  129. </body>
  130. </html>

Your design will look like this:

design

Code chamber

Step 4

Open your listbox_demo.aspx.cs and write some code so that our application works.

  1. using System;
  2. using System.Collections.Generic;
  3. using System.Linq;
  4. using System.Web;
  5. using System.Web.UI;
  6. using System.Web.UI.WebControls;
  7. using System.Collections;
  9. public partial class _Default : System.Web.UI.Page
  10. {
  11. ArrayList ar1 = new ArrayList();
  12. ArrayList ar2 = new ArrayList();
  13. protected void Page_Load(object sender, EventArgs e)
  14. {
  16. }
  17. protected void ImageButton1_Click(object sender, ImageClickEventArgs e)
  18. {
  19. if (ListBox1.SelectedIndex >= 0)
  20. {
  21. for (int i = 0; i < ListBox1.Items.Count; i++)
  22. {
  23. if (ListBox1.Items[i].Selected)
  24. {
  25. if (!ar1.Contains(ListBox1.Items[i]))
  26. {
  27. ar1.Add(ListBox1.Items[i]);
  28. }
  29. }
  30. }
  31. for (int i = 0; i < ar1.Count; i++)
  32. {
  33. if (!ListBox2.Items.Contains(((ListItem)ar1[i])))
  34. {
  35. ListBox2.Items.Add(((ListItem)ar1[i]));
  36. }
  37. ListBox1.Items.Remove(((ListItem)ar1[i]));
  38. }
  39. ListBox2.SelectedIndex = -1;
  40. }
  41. else
  42. {
  43. lbmsg.Text = "Please select atleast one listitem";
  44. lbmsg.ForeColor = System.Drawing.Color.Red;
  45. }
  46. }
  47. protected void ImageButton2_Click(object sender, ImageClickEventArgs e)
  48. {
  49. if (ListBox2.SelectedIndex >= 0)
  50. {
  51. for (int i = 0; i < ListBox2.Items.Count; i++)
  52. {
  53. if (ListBox2.Items[i].Selected)
  54. {
  55. if (!ar2.Contains(ListBox2.Items[i]))
  56. {
  57. ar2.Add(ListBox2.Items[i]);
  58. }
  59. }
  60. }
  61. for (int i = 0; i < ar2.Count; i++)
  62. {
  63. if (!ListBox1.Items.Contains(((ListItem)ar2[i])))
  64. {
  65. ListBox1.Items.Add(((ListItem)ar2[i]));
  66. }
  67. ListBox2.Items.Remove(((ListItem)ar2[i]));
  68. }
  69. ListBox1.SelectedIndex = -1;
  70. }
  71. else
  72. {
  73. lbmsg.Text = "Data removed from listbox";
  74. lbmsg.ForeColor = System.Drawing.Color.ForestGreen;
  75. }
  76. }
  77. protected void ImageButton3_Click(object sender, ImageClickEventArgs e)
  78. {
  79. while (ListBox1.Items.Count != 0)
  80. {
  81. for (int i = 0; i < ListBox1.Items.Count; i++)
  82. {
  83. ListBox2.Items.Add(ListBox1.Items[i]);
  84. ListBox1.Items.Remove(ListBox1.Items[i]);
  85. }
  86. }
  87. lbmsg.Text = "All data added to listbox2";
  88. lbmsg.ForeColor = System.Drawing.Color.ForestGreen;
  89. }
  92. protected void ImageButton4_Click(object sender, ImageClickEventArgs e)
  93. {
  94. while (ListBox2.Items.Count != 0)
  95. {
  96. for (int i = 0; i < ListBox2.Items.Count; i++)
  97. {
  98. ListBox1.Items.Add(ListBox2.Items[i]);
  99. ListBox2.Items.Remove(ListBox2.Items[i]);
  100. }
  101. }
  102. lbmsg.Text = "All data removed and moved to listbox1";
  103. lbmsg.ForeColor = System.Drawing.Color.ForestGreen;
  104. }
  105. }
Output chamber

listbox

Here the first button is as:
  1. Move data one.
  2. Remove data one.
  3. Add all.
  4. Remove all.

move data from listbox

move data

I hope you like this. Thank you for reading, have a good day.