Post
Ask Question

Show Selected Data of Checkboxlist Inside Textbox in ASP.Net

We took one bound checkboxlist and a TextBox. When the user checked a checkbox and clicks the button for it, the selected data will be entered into the TextBox.

Initial Chamber

Step 1

Open your Visual Studio 2010 and create an Empty Website, provide a suitable name (CheckBoxList_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:

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

For SQL Server Database

CheckBoxList_demo (your empty website) then right-click then select Add New Item -> SQL Server Database. (Add a database inside the App_Data_folder).

DATABASE CHAMBER

Step 3

In Server Explorer, click on your database (Database.mdf) then select Tables -> Add New Table. Make the table like this.

Table tbl_data (Don't forget to make ID as IS Identity -- True).

table design
We had embed some data in the table tbl_seo. To do that just go to your table then right-click then select Show Table Data then enter your data in the given field.

table

Design Chamber

Step 4

Open your CheckBoxList_demo.aspx file from Solution Explorer and start designing you're application as in the following:

  1. <%@PageLanguage="C#"AutoEventWireup="true"CodeFile="Default.aspx.cs"Inherits="_Default"%>  
  2. <!DOCTYPEhtmlPUBLIC"-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
  3. <html  
  4.     xmlns="http://www.w3.org/1999/xhtml">  
  5.     <headrunat="server">  
  6.         <title></title>  
  7.         <styletype="text/css">  
  8. .style2  
  9.         {  
  10. width: 358px;  
  11.         }  
  12. .style3  
  13.         {  
  14. width: 44px;  
  15.         }  
  16. .style4  
  17.         {  
  18. width: 358px;  
  19. text-decoration: underline;  
  20. font-size: medium;  
  21.         }  
  22.   
  23.         </style>  
  24.     </head>  
  25.     <body>  
  26.         <formid="form1"runat="server">  
  27.             <div>  
  28.                 <tablestyle="width:100%;">  
  29.                     <tr>  
  30.                         <tdclass="style3">  
  31.    
  32.                         </td>  
  33.                         <tdclass="style4">  
  34.                             <strong>CheckBox List to Textbox</strong>  
  35.                         </td>  
  36.                         <td>  
  37.  </td>  
  38.                     </tr>  
  39.                     <tr>  
  40.                         <tdclass="style3">  
  41.    
  42.                         </td>  
  43.                         <tdclass="style2">  
  44.                             <asp:CheckBoxListID="CheckBoxList1"runat="server"DataTextField="category"  
  45. DataValueField="category">  
  46.                             </asp:CheckBoxList>  
  47.                         </td>  
  48.                         <td>  
  49.                             <asp:TextBoxID="txtmsg"runat="server"TextMode="MultiLine">  
  50.                             </asp:TextBox>  
  51.                         </td>  
  52.                     </tr>  
  53.                     <tr>  
  54.                         <tdclass="style3">  
  55.    
  56.                         </td>  
  57.                         <tdclass="style2">  
  58.    
  59.                         </td>  
  60.                         <td>  
  61.  </td>  
  62.                     </tr>  
  63.                     <tr>  
  64.                         <tdclass="style3">  
  65.    
  66.                         </td>  
  67.                         <tdclass="style2">  
  68.                             <asp:ButtonID="Button1"runat="server"onclick="Button1_Click"  
  69. Text="Submit your data to textbox"/>  
  70.                         </td>  
  71.                         <td>  
  72.  </td>  
  73.                     </tr>  
  74.                 </table>  
  75.             </div>  
  76.         </form>  
  77.     </body>  
  78. </html>  
Your design looks as in the image given below:

design

Code Chamber

Finally open your CheckBoxList_demo.aspx.cs file to write the code, so that the application works.

Here is the code:
  1. using System;  
  2. usingSystem.Collections.Generic;  
  3. usingSystem.Linq;  
  4. usingSystem.Web;  
  5. usingSystem.Web.UI;  
  6. usingSystem.Web.UI.WebControls;  
  7. usingSystem.Data;  
  8. usingSystem.Data.SqlClient;  
  9.   
  10.   
  11. publicpartialclass_Default : System.Web.UI.Page  
  12. {  
  13. protectedvoidPage_Load(object sender, EventArgs e)  
  14.     {  
  15. if (!Page.IsPostBack)  
  16.         {  
  17. SqlConnection con = newSqlConnection(@"Data Source=.\SQLEXPRESS;AttachDbFilename=|DataDirectory|\Database.mdf;Integrated Security=True;User Instance=True");  
  18. SqlCommandcmd = newSqlCommand("select * from tbl_seo", con);  
  19. SqlDataAdaptersda = newSqlDataAdapter(cmd);  
  20. DataTabledt = newDataTable();  
  21. sda.Fill(dt);  
  22.   
  23.             CheckBoxList1.DataSource = dt;  
  24. CheckBoxList1.DataBind();  
  25.         }  
  26.   
  27.     }  
  28. protectedvoid Button1_Click(object sender, EventArgs e)  
  29.     {  
  30.   
  31. for (inti = 0; i< CheckBoxList1.Items.Count; i++)  
  32.         {  
  33.   
  34. if (CheckBoxList1.Items[i].Selected)  
  35.             {  
  36. txtmsg.Text += CheckBoxList1.Items[i].Text + ",";  
  37.             }  
  38.         }  
  39.   
  40. txtmsg.ForeColor = System.Drawing.Color.MediumVioletRed;  
  41.   
  42.     }  
  43.   
  44. }  
Output Chamber

output

checkbox

I hope you like it. Thank you for reading. Have a good day.


Similar Articles