Friday, 12 August 2016

Get Data from Database using Selected IDs

In this article I’ll show you how to get the data from database using select ids from dropdownlist, were you will select the ids from dropdownlist and when you click on the button you get the ids necessary information [well I include only name and city :P]





INITIAL CHAMBER:



Step1) Open Your Visual Studio 2010 and Create an Empty Website, Give a suitable name [gridview_demo].

Step2) In Solution Explorer you get your empty website, then add a Web Form and SQL Server Database. By going like this –

For Web Form:

gridview_demo (Your Empty Website) -> Right Click -> Add New Item -> Web Form. Name it as -> gridviewid_demo.aspx.

For SQL Server Database:

gridview_demo (Your Empty Website) -> Right Click -> Add New Item -> SQL Server Database. [Add Database inside the App_Data_folder].




DATABASE CHAMBER:


Step3) In Server Explorer, Click on your Database [Database.mdf] - -> Tables - -> Add New Table -:- Make table like this:
   
  • Table - -> tbl_data [Don’t Forget to make ID as IS Identity -- True]

C:\Users\Nilesh\Desktop\tbl_data.jpg

Make some entries in Database by going to - - Table - -> tbl_data - -> Right Click - -> Show Table Data. Don’t copy my entries - - Make yours uh uh uh ☺.

C:\Users\Nilesh\Desktop\show_table_data.jpg


DESIGN CHAMBER:


Step4) Now make some design for your application by going to gridviewid_demo.aspx and fry the code like this:


  • Gridviewid_demo.aspx:



<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>

<!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
       {
           font-size: large;
           text-align: center;
       }
       .style2
       {
           width: 272px;
       }
       .style3
       {
           width: 264px;
       }
   </style>
</head>
<body>
   <form id="form1" runat="server">
   <div class="style1">
   
       <strong>Get Data From Database using Seleceted IDs</strong></div>
   <table style="width:100%;">
              <tr>
           <td class="style2">
               &nbsp;</td>
           <td class="style3">
               <asp:DropDownList ID="DropDownList1" runat="server" AppendDataBoundItems="True"
                   AutoPostBack="True" DataTextField="id" DataValueField="id" Height="16px"
                   Width="118px">
                   <asp:ListItem Value="0">-- Select Id--</asp:ListItem>
               </asp:DropDownList>
           </td>
           <td>
               <asp:Button ID="Button1" runat="server" BackColor="#FFFF66"
                   BorderColor="#CC3300" ForeColor="#6600FF" onclick="Button1_Click"
                   Text="Click Here to show the Data" />
           </td>
       </tr>
        <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False"
                   BackColor="White" BorderColor="#336666" BorderStyle="Double" BorderWidth="3px"
                   CellPadding="4" DataKeyNames="id" GridLines="Horizontal">
                   <Columns>
                       <asp:TemplateField HeaderText="UserId">
                           <EditItemTemplate>
                               <asp:TextBox ID="TextBox2" runat="server" Text='<%# Bind("id") %>'></asp:TextBox>
                           </EditItemTemplate>
                           <ItemTemplate>
                               <asp:Label ID="Label2" runat="server" Text='<%# Bind("id") %>'></asp:Label>
                           </ItemTemplate>
                       </asp:TemplateField>
                       <asp:TemplateField HeaderText="Name">
                           <EditItemTemplate>
                               <asp:TextBox ID="TextBox1" runat="server" Text='<%# Bind("name") %>'></asp:TextBox>
                           </EditItemTemplate>
                           <ItemTemplate>
                               <asp:Label ID="Label1" runat="server" Text='<%# Bind("name") %>'></asp:Label>
                           </ItemTemplate>
                       </asp:TemplateField>
                       <asp:TemplateField HeaderText="City">
                           <EditItemTemplate>
                               <asp:TextBox ID="TextBox3" runat="server" Text='<%# Bind("city") %>'></asp:TextBox>
                           </EditItemTemplate>
                           <ItemTemplate>
                               <asp:Label ID="Label3" runat="server" Text='<%# Bind("city") %>'></asp:Label>
                           </ItemTemplate>
                       </asp:TemplateField>
                   </Columns>
                   <FooterStyle BackColor="White" ForeColor="#333333" />
                   <HeaderStyle BackColor="#336666" Font-Bold="True" ForeColor="White" />
                   <PagerStyle BackColor="#336666" ForeColor="White" HorizontalAlign="Center" />
                   <RowStyle BackColor="White" ForeColor="#333333" />
                   <SelectedRowStyle BackColor="#339966" Font-Bold="True" ForeColor="White" />
                   <SortedAscendingCellStyle BackColor="#F7F7F7" />
                   <SortedAscendingHeaderStyle BackColor="#487575" />
                   <SortedDescendingCellStyle BackColor="#E5E5E5" />
                   <SortedDescendingHeaderStyle BackColor="#275353" />
               </asp:GridView>
           </td>
          
       </tr>
       
   </table>
   </form>
</body>
</html>




Your Design Will look like this:


C:\Users\Nilesh\Desktop\gridviewid_demo.aspx_design.jpg







CODE CHAMBER:


Step5) Now it’s time for server side coding so that our application get work, Open your gridviewid_demo.aspx.cs file and code it like below.



  • Gridviewid_demo.aspx.cs


Don’t forget the namespaces –


C:\Users\Nilesh\Desktop\namespaces.jpg





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)
   {
       if (!Page.IsPostBack)
       {
           SqlConnection con = new SqlConnection(@"Data Source=.\SQLEXPRESS;AttachDbFilename=|DataDirectory|\Database.mdf;Integrated Security=True;User Instance=True") ;
           SqlCommand cmd = new SqlCommand("select * from tbl_data", con);
           SqlDataAdapter sda = new SqlDataAdapter(cmd);
           DataTable dt = new DataTable();
           sda.Fill(dt);
           DropDownList1.DataSource = dt;
           DropDownList1.DataBind();

       }
   }





   protected void Button1_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("select * from tbl_data where id=" + DropDownList1.SelectedItem.Value, con);
       SqlDataAdapter sda = new SqlDataAdapter(cmd);
       DataTable dt = new DataTable();
       sda.Fill(dt);
       GridView1.DataSource = dt;
       GridView1.DataBind();
   }
}



OUTPUT CHAMBER:


C:\Users\Nilesh\Desktop\output_gridviewid_demo.jpg


Check out the database, that who is ID=2 , We will get ID=2 [purnima’s data in gridview]


C:\Users\Nilesh\Desktop\show_table_data_id_2.jpg



C:\Users\Nilesh\Desktop\outut of gridviewid_demo.jpg


 
Hope you like it ! Thank you for Reading!