Open Visual Studio 2015 -> File-> New -> Web Site.
new

Now Add jQuery from ManageNuget.

add

add

Now Add a new web form.

add

Below is my SQL Server Data Table.

  1. CREATE TABLE [dbo].[Emp_Information](
  2. [EMP_ID] [int] IDENTITY(1,1) NOT NULL,
  3. [Name] [varchar](50) NULL,
  4. [ProjectName] [varchar](50) NULL,
  5. [ManagerName] [varchar](50) NULL,
  6. [City] [varchar](50) NULL,
  7. [Joining_Date] [datetime] NULL,
  8. CONSTRAINT [PK_Emp_Information] PRIMARY KEY CLUSTERED
  9. (
  10. [EMP_ID] ASC
  11. )WITH (PAD_INDEX = OFF, STATISTICS_NORECOMPUTE = OFF,
  12. IGNORE_DUP_KEY = OFF, ALLOW_ROW_LOCKS = ON, ALLOW_PAGE_LOCKS = ON) ON [PRIMARY]
  13. ) ON [PRIMARY]
  15. GO
  17. SET ANSI_PADDING OFF
  18. GO
code

Data in my Table

table

Now come to your Visual Studio Application. Do below aspx code.
  1. <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
  2. <!DOCTYPE html>
  3. <html xmlns="http://www.w3.org/1999/xhtml">
  4. <head runat="server">
  5. <title>jQuery: Read Grid View Column Value</title>
  6. <script src="Scripts/jquery-2.2.3.min.js"></script>
  7. <script type="text/javascript">
  8. $(document).ready(function () {
  9. $("#dvColumnVal").empty();
  10. var colVAL = "";
  11. $("#btnGet").click(function () {
  12. var ddlSelectedCol = $("#ddlColumn").val();
  13. $("#<%=GridViewEmployee.ClientID %> tr").each(function () {
  14. if (!this.rowIndex) return;
  15. var currVAL = $(this).find("td:eq('" + ddlSelectedCol + "')").html();
  16. colVAL += currVAL + ", ";
  17. });
  18. $("#dvColumnVal").html(colVAL);
  19. });
  20. });
  21. </script>
  22. </head>
  23. <body>
  24. <form id="form1" runat="server">
  25. <table style="border: 25px solid red; width: 100%; background-color: skyblue;">
  26. <tr>
  27. <td align="center" style="height: 30px; background-color: coral; font-size: 15pt; font-weight: bold; color: white;">jQuery: Read Grid View Any Column Value</td>
  28. </tr>
  29. <tr>
  30. <td>
  31. <asp:GridView ID="GridViewEmployee" runat="server" Width="100%">
  32. </asp:GridView>
  33. </td>
  34. </tr>
  35. <tr>
  36. <td height="10px"></td>
  37. </tr>
  38. <tr>
  39. <td style="height: 30px; background-color: coral; font-size: 15pt; font-weight: bold; color: green;">Select Column Name to get Value
  40. <asp:DropDownList ID="ddlColumn" runat="server">
  41. <asp:ListItem Text="EMP_ID" Value="0"></asp:ListItem>
  42. <asp:ListItem Text="Name" Value="1"></asp:ListItem>
  43. <asp:ListItem Text="Project Name" Value="2"></asp:ListItem>
  44. <asp:ListItem Text="Manager Name" Value="3"></asp:ListItem>
  45. <asp:ListItem Text="City" Value="4"></asp:ListItem>
  46. <asp:ListItem Text="Joining Date" Value="5"></asp:ListItem>
  47. </asp:DropDownList>
  48. <input type="button" id="btnGet" value="Get Value" />
  49. </td>
  50. </tr>
  51. <tr>
  52. <td height="10px"></td>
  53. </tr>
  54. <tr>
  55. <td>
  56. <div id="dvColumnVal" class="aDiv">
  57. </div>
  58. </td>
  59. </tr>
  60. </table>
  61. </form>
  62. </body>
  63. </html>
Aspx.cs code
  1. using System;
  2. using System.Collections.Generic;
  3. using System.Data;
  4. using System.Data.SqlClient;
  5. using System.Linq;
  6. using System.Web;
  7. using System.Web.UI;
  8. using System.Web.UI.WebControls;
  10. public partial class _Default : System.Web.UI.Page
  11. {
  12. protected void Page_Load(object sender, EventArgs e)
  13. {
  14. if (!Page.IsPostBack)
  15. {
  16. BindEmployeeData();
  17. }
  18. }
  20. public void BindEmployeeData()
  21. {
  22. DataSet ds = new DataSet();
  23. using (SqlConnection con = new SqlConnection("Data Source=.;Integrated Security=true;Initial Catalog=CompanyDB"))
  24. {
  25. con.Open();
  26. SqlCommand cmd = new SqlCommand("select * from Emp_Information", con);
  27. SqlDataAdapter da = new SqlDataAdapter(cmd);
  28. da.Fill(ds);
  29. con.Close();
  30. GridViewEmployee.DataSource = ds;
  31. GridViewEmployee.DataBind();
  32. }
  33. }
  34. }
Now Run your application.
application

Select column from drop down list

application

application