Display GridView Selected Row Details in AJAX ModalPopup in ASP.Net

Hi onais,

Please teke refernce to the below code and correct your code.

HTML

<cc1:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server">
</cc1:ToolkitScriptManager>
<asp:GridView ID="GridView1" HeaderStyle-BackColor="#3AC0F2" HeaderStyle-ForeColor="White"
    runat="server" AutoGenerateColumns="false" OnSelectedIndexChanged="OnSelectedIndexChanged">
    <Columns>
        <asp:BoundField DataField="CustomerID" HeaderText="Id" ItemStyle-Width="30" />
        <asp:BoundField DataField="Country" HeaderText="Country" ItemStyle-Width="150" />
        <asp:TemplateField HeaderText="ContactName">
            <ItemTemplate>
                <asp:Label ID="lblCountry" Text='<%# Eval("ContactName") %>' runat="server" />
            </ItemTemplate>
        </asp:TemplateField>
        <asp:ButtonField Text="Select" CommandName="Select" />
    </Columns>
</asp:GridView>
<asp:LinkButton Text="" ID="lnkFake" runat="server" />
<cc1:ModalPopupExtender ID="mpe" runat="server" PopupControlID="pnlPopup" TargetControlID="lnkFake"
    CancelControlID="btnClose" BackgroundCssClass="modalBackground">
</cc1:ModalPopupExtender>
<asp:Panel ID="pnlPopup" runat="server" CssClass="modalPopup" Style="display: none">
    <div class="header">
        Details
    </div>
    <div class="body">
        <table border="0" cellpadding="0" cellspacing="0">
            <tr>
                <td style="width: 60px">
                    <b>Id: </b>
                </td>
                <td>
                    <asp:Label ID="lblId" runat="server" />
                </td>
            </tr>
            <tr>
                <td>
                    <b>Name: </b>
                </td>
                <td>
                    <asp:Label ID="lblName" runat="server" />
                </td>
            </tr>
            <tr>
                <td>
                    <b>Country: </b>
                </td>
                <td>
                    <asp:Label ID="lblCountry" runat="server" />
                </td>
            </tr>
            <tr>
                <td>
                    <b>City: </b>
                </td>
                <td>
                    <asp:Label ID="lblCity" runat="server" />
                </td>
            </tr>
            <tr>
                <td>
                    <b>PostalCode: </b>
                </td>
                <td>
                    <asp:Label ID="lblPostalCode" runat="server" />
                </td>
            </tr>
        </table>
    </div>
    <div class="footer" align="right">
        <asp:Button ID="btnClose" runat="server" Text="Close" CssClass="button" />
    </div>
</asp:Panel>

Namespaces

C#

using System.Data;
using System.Data.SqlClient;
using System.Configuration;

Vb.Net

Imports System.Data
Imports System.Data.SqlClient

Code

C#

protected void Page_Load(object sender, EventArgs e)
{
    if (!this.IsPostBack)
    {
        string constr = ConfigurationManager.ConnectionStrings["constr"].ConnectionString;
        using (SqlConnection con = new SqlConnection(constr))
        {
            using (SqlCommand cmd = new SqlCommand("SELECT Top 5 CustomerID, Country,ContactName,City,PostalCode FROM Customers", con))
            {
                using (SqlDataAdapter da = new SqlDataAdapter(cmd))
                {
                    DataTable dt = new DataTable();
                    da.Fill(dt);
                    GridView1.DataSource = dt;
                    GridView1.DataBind();
                }
            }
        }
    }
}

protected void OnSelectedIndexChanged(object sender, EventArgs e)
{
    lblId.Text = GridView1.SelectedRow.Cells[0].Text;
    string constr = ConfigurationManager.ConnectionStrings["constr"].ConnectionString;
    using (SqlConnection con = new SqlConnection(constr))
    {
        using (SqlCommand cmd = new SqlCommand("SELECT CustomerID, Country,ContactName,City,PostalCode FROM Customers WHERE CustomerID=@CustomerID", con))
        {
            cmd.Parameters.AddWithValue("@CustomerID", lblId.Text);
            using (SqlDataAdapter da = new SqlDataAdapter(cmd))
            {
                DataTable dt = new DataTable();
                da.Fill(dt);
                lblName.Text = dt.Rows[0]["ContactName"].ToString();
                lblCountry.Text = dt.Rows[0]["Country"].ToString();
                lblCity.Text = dt.Rows[0]["City"].ToString();
                lblPostalCode.Text = dt.Rows[0]["PostalCode"].ToString();
                mpe.Show();
            }
        }
    }
}

Vb.Net

Protected Sub Page_Load(ByVal sender As Object, ByVal e As EventArgs) Handles Me.Load
    If Not Me.IsPostBack Then
        Dim constr As String = ConfigurationManager.ConnectionStrings("constr").ConnectionString
        Using con As SqlConnection = New SqlConnection(constr)
            Using cmd As SqlCommand = New SqlCommand("SELECT Top 5 CustomerID, Country,ContactName,City,PostalCode FROM Customers", con)
                Using da As SqlDataAdapter = New SqlDataAdapter(cmd)
                    Dim dt As DataTable = New DataTable()
                    da.Fill(dt)
                    GridView1.DataSource = dt
                    GridView1.DataBind()
                End Using
            End Using
        End Using
    End If
End Sub

Protected Sub OnSelectedIndexChanged(ByVal sender As Object, ByVal e As EventArgs)
    lblId.Text = GridView1.SelectedRow.Cells(0).Text
    Dim constr As String = ConfigurationManager.ConnectionStrings("constr").ConnectionString
    Using con As SqlConnection = New SqlConnection(constr)
        Using cmd As SqlCommand = New SqlCommand("SELECT CustomerID, Country,ContactName,City,PostalCode FROM Customers WHERE CustomerID=@CustomerID", con)
            cmd.Parameters.AddWithValue("@CustomerID", lblId.Text)
            Using da As SqlDataAdapter = New SqlDataAdapter(cmd)
                Dim dt As DataTable = New DataTable()
                da.Fill(dt)
                lblName.Text = dt.Rows(0)("ContactName").ToString()
                lblCountry.Text = dt.Rows(0)("Country").ToString()
                lblCity.Text = dt.Rows(0)("City").ToString()
                lblPostalCode.Text = dt.Rows(0)("PostalCode").ToString()
                mpe.Show()
            End Using
        End Using
    End Using
End Sub

Screenshot