Display jQuery Dialog Popup when LinkButton inside GridView is clicked in ASP.Net

Hi smile,

Please refer below sample.

HTML

<asp:GridView ID="GridView1" HeaderStyle-BackColor="#3AC0F2" HeaderStyle-ForeColor="White"
    runat="server" AutoGenerateColumns="false">
    <Columns>
        <asp:BoundField DataField="AdmissionNo" ItemStyle-CssClass="Id" HeaderText="AdmissionNo" />
        <asp:BoundField DataField="Name" ItemStyle-CssClass="Name" HeaderText="Name" />
        <asp:TemplateField>
            <ItemTemplate>
                <asp:LinkButton Text="Preview" ID="lnkView" runat="server" OnClick="Preview" />
            </ItemTemplate>
        </asp:TemplateField>
    </Columns>
</asp:GridView>
<div id="dialog" style="display: none">
    <asp:Label ID="lblMessage" runat="server" />
</div>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script src="http://ajax.aspnetcdn.com/ajax/jquery.ui/1.8.9/jquery-ui.js" type="text/javascript"></script>
<link rel="stylesheet" type="text/css" href="http://ajax.aspnetcdn.com/ajax/jquery.ui/1.8.9/themes/start/jquery-ui.css" />
<script type="text/javascript">
    function ShowPopup() {
        $(function () {
            $("#dialog").dialog({
                title: "Preview",
                buttons: {
                    Close: function () {
                        $(this).dialog('close');
                    }
                },
                modal: true
            });
        });
    };
</script>

Namespaces

C#

using System.Data;

VB.Net

Imports System.Data

Code

C#

protected void Page_Load(object sender, EventArgs e)
{
    if (!this.IsPostBack)
    {
        DataTable dt = new DataTable();
        dt.Columns.AddRange(new DataColumn[] { new DataColumn("AdmissionNo", typeof(string)),
                    new DataColumn("Name", typeof(string)),new DataColumn("Description", typeof(string))});
        dt.Rows.Add("R-000001", "John Hammond", "This is to certify that bears a good moral character.");
        dt.Rows.Add("R-000002", "Mudassar Khan", "");
        dt.Rows.Add("R-000003", "Suzanne Mathews", "");
        dt.Rows.Add("R-000004", "Robert Schidner", "");
        GridView1.DataSource = dt;
        GridView1.DataBind();
    }
}

protected void Preview(object sender, EventArgs e)
{
    // Get this text from Database.
    string messageText = "This is to certify that {SName} having {AdmissionNo} bears a good moral of character.";
    LinkButton lnk = sender as LinkButton;
    string admissionNumber = (lnk.NamingContainer as GridViewRow).Cells[0].Text;
    string name = (lnk.NamingContainer as GridViewRow).Cells[1].Text;
    messageText = messageText.Replace("{SName}", name).Replace("{AdmissionNo}", "AdmissionNo " + admissionNumber);
    lblMessage.Text = messageText;
    ScriptManager.RegisterStartupScript((sender as Control), this.GetType(), "Popup", "ShowPopup();", true);
}

VB.Net

Protected Sub Page_Load(ByVal sender As Object, ByVal e As EventArgs) Handles Me.Load
    If Not Me.IsPostBack Then
        Dim dt As DataTable = New DataTable()
        dt.Columns.AddRange(New DataColumn() {New DataColumn("AdmissionNo", GetType(String)), New DataColumn("Name", GetType(String)), New DataColumn("Description", GetType(String))})
        dt.Rows.Add("R-000001", "John Hammond", "This is to certify that bears a good moral character.")
        dt.Rows.Add("R-000002", "Mudassar Khan", "")
        dt.Rows.Add("R-000003", "Suzanne Mathews", "")
        dt.Rows.Add("R-000004", "Robert Schidner", "")
        GridView1.DataSource = dt
        GridView1.DataBind()
    End If
End Sub

Protected Sub Preview(ByVal sender As Object, ByVal e As EventArgs)
    Dim messageText As String = "This is to certify that {SName} having {AdmissionNo} bears a good moral of character."
    Dim lnk As LinkButton = TryCast(sender, LinkButton)
    Dim admissionNumber As String = (TryCast(lnk.NamingContainer, GridViewRow)).Cells(0).Text
    Dim name As String = (TryCast(lnk.NamingContainer, GridViewRow)).Cells(1).Text
    messageText = messageText.Replace("{SName}", name).Replace("{AdmissionNo}", "AdmissionNo " & admissionNumber)
    lblMessage.Text = messageText
    ScriptManager.RegisterStartupScript((TryCast(sender, Control)), Me.GetType(), "Popup", "ShowPopup();", True)
End Sub

Screenshot