Find controls inside grid view using JQuery

Find controls inside grid view using JQuery

Below is the code which loops through grid view and find check box I have put inside template field. Then I find the other controls based on the id of the checkĀ  box I have found inside the current row of grid view.

I have also put data list inside the grid view. Based on the id of checkbox I got data list and then again loop through the data list. I just find the hidden field from the data list and base on the value of the hidden field I am making text box visible true/false.

 

J Query function :

function HideShow () {
    $('#<%=GridView1.ClientID %>').find("input:checkbox").each(function() {
        if (this.checked == true) {
            var chkId;
            chkId = $(this).attr('id');
            var tblId;
            tblId = chkId.replace('_chk', '_DataList1');
            var tbl;
            tbl = document.getElementById(tblId);
            var hdnType;
            hdnType = 0;
            $(tbl).find('tr').each(function() {
                $(this).find("input[type='hidden'][id$=hdnType]").each(function() {
                    if ($(this).val() == "1") {
                        hdnType = 1;
                        var txtAmountId;
                        var txtAmount;
                        txtAmountId = $(this).attr('id').replace('_hdnType', '_txt');
                        txtAmount = document.getElementById(txtAmountId);
                        $(txtAmount).hide();
                    }
                });
            });
        }
    });

}

Grid View Design :

<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False">
    <Columns>
        <asp:TemplateField>
            <ItemTemplate>
                <asp:CheckBox ID="chk" runat="server" Checked="'<%# Convert.ToBoolean(Eval("IsPremises").ToString()) %>'" />
            </ItemTemplate>
        </asp:TemplateField>
        <asp:TemplateField>
            <ItemTemplate>
                <table cellpadding="3" cellspacing="0" border="0" width="99%" align="center">
                    <tr>
                        <td>
                            <asp:DataList runat="server" ID="dlExposure" Width="100%">
                                <ItemTemplate>
                                    <table width="100%" cellpadding="0" cellspacing="0">
                                        <tr id="trPayroll" runat="server">
                                            <td width="80%" align="left">
                                                <asp:Label ID="lblExposureType" runat="server" CssClass="label" Text="'<%# DataBinder.Eval(Container.DataItem,"PremimumBasis") %>'"></asp:Label>
                                                <asp:HiddenField ID="hdnType" runat="server" Value="'<%# DataBinder.Eval(Container.DataItem,"Type") %>'" />
                                            </td>
                                            <td width="20%" align="left">
                                                <asp:TextBox ID="txt" Width="50px" runat="server" Text="'<%# DataBinder.Eval(Container.DataItem,"ExposureAmount") %>'"
                                                    MaxLength="14"></asp:TextBox>
                                            </td>
                                        </tr>
                                    </table>
                                </ItemTemplate>
                            </asp:DataList>
                        </td>
                    </tr>
                </table>
            </ItemTemplate>
        </asp:TemplateField>
    </Columns>
</asp:GridView>

Enjoy Coding…

Leave a Reply