jquery - Finding nested Gridview and controls in i

Need help in finding nested Gridview and controls present in it for e.g. label using jquery

I am in middle of doing calculations below is the jquery code.

$("#<%=gvSupplierList.ClientID %>").each(function () {

    //hardcoded control id of parent gridview
    $(this).find('span[id$="gvSupplierList_lblsizeofopt_0"]').text('0.01');

    //hardcoded control id of child/nested gridview
    $("#gvSupplierList_gvCustomerList_0 > tbody > tr").each(function () {

        //hardcoded control id of child/nested control 
        $(this).find('input[id$="gvSupplierList_gvCustomerList_0_txtsizeofopt_0"]').val();

    });

});

Thanks in advance.

You need to use FindControl to navigate up the Control Tree and locate the correct TextBox in the Rows of the Child GridView.

<asp:GridView ID="GridViewParent" runat="server" OnRowDataBound="GridView1_RowDataBound">
    <Columns>
        <asp:TemplateField>
            <ItemTemplate>

                <asp:GridView ID="GridViewChild" runat="server">
                    <Columns>
                        <asp:TemplateField>
                            <ItemTemplate>

                                <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>

                            </ItemTemplate>
                        </asp:TemplateField>
                    </Columns>
                </asp:GridView>

            </ItemTemplate>
        </asp:TemplateField>
    </Columns>
</asp:GridView>

<script type="text/javascript">
    $("#<%= ((GridView)GridViewParent.Rows[1].FindControl("GridViewChild")).Rows[2].FindControl("TextBox1").ClientID %>").val("TextBox is found!");
</script>

In this snippet the TextBox in row 1 of the parent and row 2 of the child is located and the text set.

Or if you know both the rows in jQUewry you can also do this

<script type="text/javascript">
    var parentRow = 3;
    var childRow = 5;

    $('#<%= GridViewParent.ClientID %> table').each(function (index, element) {
        if (index == parentRow) {
            $('#' + element.id + ' input[type="text"]').each(function (indexNested, elementNested) {
                if (indexNested == childRow) {
                    $(this).val("TextBox is found!")
                }
            });
        }
    });
</script>