Monday, August 30, 2010

Using ASP.NET and jQuery to Pass Multiple Values from a GridView to Another Page

{asp:gridview allowpaging="True" allowsorting="True" autogeneratecolumns="False" datakeynames="CustomerID" datasourceid="SqlDataSource1" id="GridView1" runat="server">
            {columns>                         
                [asp:boundfield datafield="CustomerID" headertext="CustomerID" readonly="True" sortexpression="CustomerID">
                [asp:boundfield datafield="CompanyName" headertext="CompanyName" sortexpression="CompanyName">
                [asp:boundfield datafield="ContactName" headertext="ContactName" sortexpression="ContactName">
                [asp:boundfield datafield="Address" headertext="Address" sortexpression="Address">
                [asp:boundfield datafield="City" headertext="City" sortexpression="City">
            [/asp:boundfield>
        [/asp:boundfield}

C#
    protected void Page_Load(object sender, EventArgs e)
    {
        string cid = Request.QueryString["CID"];
        string cname = Request.QueryString["CName"];
        Response.Write("CustomerID= " + cid + " : " + "CompanyName= " + cname);
    }


{script type="text/javascript">

        $(document).ready(function() {
            $("tr").click(function(event) {
                var row = jQuery(this)
                var firstParam = row.children("td:eq(0)").text();
                var secondParam = row.children("td:eq(1)").text();              
                var navUrl = "http://localhost:7250/GridViewRowJQuery/CustomerDetails.aspx?cid=" + firstParam + "&cname=" + secondParam;
                top.location = navUrl;

            });
        });
   
{/script}