From the reference of this link

Here i am passing Order Id and ShipName

Filter GridView between Date Range using jQuery AJAX in ASP.Net

I have edited the GridView Column

<asp:GridView ID="gvOrders" runat="server" AutoGenerateColumns="false">
    <Columns>
        <asp:TemplateField HeaderText="Order Id" ItemStyle-CssClass="Order Id">
            <ItemTemplate>
                <a href="#" id="lnkOrderId"></a>
            </ItemTemplate>
        </asp:TemplateField>
        <asp:BoundField HeaderStyle-Width="150px" DataField="ShipName" HeaderText="Ship Name" ItemStyle-CssClass="ShipName"/>
        <asp:BoundField HeaderStyle-Width="150px" DataField="ShipCity" HeaderText="Ship City" />
        <asp:BoundField HeaderStyle-Width="150px" DataField="OrderDate" HeaderText="Order Date" />
    </Columns>
</asp:GridView>

and changed this line

$("td", row).eq(0).text($(this).find("OrderId").text());

to

$("td a", row).eq(0).text($(this).find("OrderId").text());

And Added this Script in page to open popup window

<script type="text/javascript">
    $('#lnkOrderId').live('click', function () {
        var shipName = $(this).parent().closest('tr').find('.ShipName').html();
        var url = "Popup.aspx?OrderId=" + $(this).text() + "&shipName=" + shipName;
        window.open(url, 'popup_window', 'width=300,height=100');
    });
</script>

Body and HTML

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script src="ASPSnippets_Pager.min.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(function () {
            GetCustomers(1);
            $('[id*=btnSearch]').bind('click', function () {
                GetCustomers(1);
                return false;
            });

        });

        $(".Pager .page").live("click", function () {
            GetCustomers(parseInt($(this).attr('page')));
        });
        function FromDate() {
            return jQuery.trim($("[id*=txtFrom]").val());
        };
        function ToDate() {
            return jQuery.trim($("[id*=txtTo]").val());
        };
        function GetCustomers(pageIndex) {
            $.ajax({
                type: "POST",
                url: "Default.aspx/GetCustomers",
                data: '{from: "' + FromDate() + '",to: "' + ToDate() + '", pageIndex: ' + pageIndex + '}',
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                success: OnSuccess,
                failure: function (response) {
                    alert(response.d);
                },
                error: function (response) {
                    alert(response.d);
                }
            });
        }
        var row;
        function OnSuccess(response) {
            var xmlDoc = $.parseXML(response.d);
            var xml = $(xmlDoc);
            var customers = xml.find("Customers");
            if (row == null) {
                row = $("[id*=gvOrders] tr:last-child").clone(true);
            }
            $("[id*=gvOrders] tr").not($("[id*=gvOrders] tr:first-child")).remove();
            if (customers.length > 0) {
                $.each(customers, function () {
                    var customer = $(this);
                    $("td a", row).eq(0).text($(this).find("OrderId").text());
                    $("td", row).eq(1).html($(this).find("ShipName").text());
                    $("td", row).eq(2).html($(this).find("ShipCity").text());
                    $("td", row).eq(3).html($(this).find("OrderDate").text());
                    $("[id*=gvOrders]").append(row);
                    row = $("[id*=gvOrders] tr:last-child").clone(true);
                });
                var pager = xml.find("Pager");
                $(".Pager").ASPSnippets_Pager({
                    ActiveCssClass: "current",
                    PagerCssClass: "pager",
                    PageIndex: parseInt(pager.find("PageIndex").text()),
                    PageSize: parseInt(pager.find("PageSize").text()),
                    RecordCount: parseInt(pager.find("RecordCount").text())
                });


            } else {
                var empty_row = row.clone(true);
                $("td:first-child", empty_row).attr("colspan", $("td", row).length);
                $("td:first-child", empty_row).attr("align", "center");
                $("td:first-child", empty_row).html("No records found for the search criteria.");
                $("td", empty_row).not($("td:first-child", empty_row)).remove();
                $("[id*=gvOrders]").append(empty_row);
            }
        };
    </script>
<script type="text/javascript">
    $('#lnkOrderId').live('click', function () {
        var shipName = $(this).parent().closest('tr').find('.ShipName').html();
        var url = "Popup.aspx?OrderId=" + $(this).text() + "&shipName=" + shipName;
        window.open(url, 'popup_window', 'width=300,height=100');
    });
</script>
</head>
<body>
    <form id="form1" runat="server">
    OderDate From
    <asp:TextBox ID="txtFrom" Text="13/07/1996" runat="server" />
    <br />
    OderDate To
    <asp:TextBox ID="txtTo" Text="05/07/1997" runat="server" />
    <br />
    <asp:Button ID="btnSearch" Text="Search" runat="server" />
    <hr />
    <asp:GridView ID="gvOrders" runat="server" AutoGenerateColumns="false">
        <Columns>
            <asp:TemplateField HeaderText="Order Id" ItemStyle-CssClass="Order Id">
                <ItemTemplate>
                    <a href="#" id="lnkOrderId"></a>
                </ItemTemplate>
            </asp:TemplateField>
            <asp:BoundField HeaderStyle-Width="150px" DataField="ShipName" HeaderText="Ship Name"
                ItemStyle-CssClass="ShipName" />
            <asp:BoundField HeaderStyle-Width="150px" DataField="ShipCity" HeaderText="Ship City" />
            <asp:BoundField HeaderStyle-Width="150px" DataField="OrderDate" HeaderText="Order Date" />
        </Columns>
    </asp:GridView>
    <br />
    <div class="Pager">
    </div>
    </form>
</body>