We took one TextBox and ListBox and on a button click it will move it to the ListBox and on another button click it will be saved to the database.
Initial chamber
Step 1
Open your Visual Studio 2010 and create an Empty Website, provide a suitable name (textListBox_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:
textListBox_demo (your empty website) then right-click then select Add New Item -> Web Form. Name it textListBox_demo.aspx.
For SQL Server Database
textListBox_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)
Design chamber
Step 4
Now open your textListBox_demo.aspx file, where we create our design for GridView sorting.
TextListBox_demo.aspx
- <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
-
- <%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="asp" %>
-
- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
-
- <html xmlns="http://www.w3.org/1999/xhtml">
- <head runat="server">
- <title></title>
- <style type="text/css">
- .style1
- {
- width: 184px;
- }
- .style2
- {
- width: 169px;
- }
- </style>
- </head>
- <body>
- <form id="form1" runat="server">
- <asp:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server">
- </asp:ToolkitScriptManager>
- <div>
-
- <table style="width:100%;">
- <tr>
- <td class="style1">
- </td>
- <td class="style2">
- </td>
- <td>
- </td>
- </tr>
- <tr>
- <td class="style1">
- <asp:TextBox ID="TextBox1" runat="server" BorderColor="#9933FF"
- BorderStyle="Solid"></asp:TextBox>
- </td>
- <td class="style2">
- <asp:Button ID="Button1" runat="server" onclick="Button1_Click"
- Text="Move to ListBox" />
- </td>
- <td>
- <asp:ListBox ID="ListBox1" runat="server" Width="200px" BackColor="#CCCCFF"
- ForeColor="#0033CC"></asp:ListBox>
- </td>
- </tr>
- <tr>
- <td class="style1">
- <asp:RequiredFieldValidator ID="RequiredFieldValidator1" ControlToValidate="TextBox1" ForeColor="Red" runat="server" ErrorMessage="Please Provide some text to textbox"></asp:RequiredFieldValidator>
- </td>
- <td class="style2">
-
- <asp:Label ID="lbmsg" runat="server"></asp:Label>
- </td>
- <td>
- <asp:Button ID="Button2" runat="server" onclick="Button2_Click"
- Text="Save to Database" Visible="False" />
- </td>
- </tr>
- </table>
-
- </div>
- </form>
- </body>
- </html>
Your design looks like this:
Code chamberStep 5
Open your textListBox_demo.aspx.cs and write some code so that our application works.
textlistobx_demo.aspx.cs
- using System;
- using System.Collections.Generic;
- using System.Linq;
- using System.Web;
- using System.Web.UI;
- using System.Web.UI.WebControls;
- using System.Data;
- using System.Data.SqlClient;
-
- public partial class _Default : System.Web.UI.Page
- {
- protected void Page_Load(object sender, EventArgs e)
- {
-
- }
- protected void Button1_Click(object sender, EventArgs e)
- {
- if (this.TextBox1.Text != null)
- {
-
- ListBox1.Items.Add(this.TextBox1.Text);
- Button2.Visible = true;
- }
-
- }
- protected void Button2_Click(object sender, EventArgs e)
- {
- SqlConnection con = new SqlConnection(@"Data Source=.\SQLEXPRESS;AttachDbFilename=|DataDirectory|\Database.mdf;Integrated Security=True;User Instance=True");
- SqlCommand cmd = new SqlCommand("insert into tbl_data (data) values (@data)", con);
- cmd.Parameters.AddWithValue("data", ListBox1.Text);
- con.Open();
- int i = cmd.ExecuteNonQuery();
- con.Close();
-
- if (i!=0)
- {
- lbmsg.Text = "Your Data have been saved to Database";
- lbmsg.ForeColor = System.Drawing.Color.ForestGreen;
- }
-
-
- }
- }
Output chamberI hope you like this. Thank you for reading. Have a good day.