Expandable/collapsible gridview - other rowindex controls do not post back

See more:

C#

ASP.NET

Gridview

Hi.

I am having a weird issue here. I have an expandable gridview. When the plus sign is clicked, the row expands and shows a div with ASP.Net controls (some of these controls have postback) Everything works fine on Row Index 0 however, other rows' controls do not fire the postback.

Could someone help?

Here's the gridview, I just put the itemtemplate here

<asp:TemplateField HeaderText="Feedback Provided?">
<ItemTemplate>
	
	<span id="feedBackInt"  runat="server" class="d-none"><%# Eval("Feedback_Submitted") %></span>
	<%# StudentNewRow(Eval("TX_NRIC")) %>
	<form action="">
		<asp:UpdatePanel ID="upInnerClaim" runat="server" UpdateMode="Conditional">
			<Triggers>
				<asp:AsyncPostBackTrigger ControlID="txtPeriodFrom" EventName="TextChanged" />
				<asp:AsyncPostBackTrigger ControlID="txtPeriodTo" EventName="TextChanged" />
				<asp:AsyncPostBackTrigger ControlID="drpPeriodChange" EventName="SelectedIndexChanged" />
			</Triggers>
			<ContentTemplate>
				<div class="container-fluid">
					<div class="row">
						<div class="col-4" style="background-color: lightgray">
							<div class="divForm">
								<label class="col-form-label-sm mb-0">Approved Internship Period:</label>
								<p class="text-primary">Only claims within this period will be approved</p>
								<div class="form-group form-inline">
									<asp:Label ID="lblQPeriodFrom" runat="server" Text='<%# Eval("TX_DT_START") %>'></asp:Label>
									<span style="margin: 0px 20px">to</span>
									<asp:Label ID="lblQPeriodTo" runat="server" Text='<%# Eval("TX_DT_END") %>'></asp:Label>
								</div>
							</div>
						</div>
						<div class="col-3">
							<div class="divForm">
								<label class="col-form-label-sm">Is there a change in internship period?</label>
								<div class="form-group">
									<asp:DropDownList ID="drpPeriodChange" runat="server" AutoPostBack="true" CssClass="form-control form-control-sm" OnSelectedIndexChanged="rdoPeriodChange_SelectedIndexChanged">
										<asp:ListItem Selected="True" Text="No" Value="0"></asp:ListItem>
										<asp:ListItem Text="Yes" Value="1"></asp:ListItem>
									</asp:DropDownList>
								</div>
							</div>
						</div>
						<div class="col">
							<div class="d-none" id="divPeriod" runat="server">
								<label for="txtPeriodFrom" class="col-form-label-sm">Internship Period:</label>
								<div class="form-group form-inline" style="margin-bottom:0px">
									
									<asp:TextBox ID="txtPeriodFrom" runat="server" Text='<%# Eval("DT_INTERNSHIP_START") %>' class="form-control form-control-sm" AutoPostBack="true" OnTextChanged="txtInternshipPeriod_TextChanged"></asp:TextBox>
									<ajax:CalendarExtender ID="calexDateFrom" runat="server" TargetControlID="txtPeriodFrom" Format="dd/MM/yyyy" />

									
									<span style="margin: 0px 20px">to</span>
									<asp:TextBox ID="txtPeriodTo" runat="server" Text='<%# Eval("DT_INTERNSHIP_END") %>' class="form-control form-control-sm" AutoPostBack="true" OnTextChanged="txtInternshipPeriod_TextChanged"></asp:TextBox>
									<ajax:CalendarExtender ID="calexDateTo" runat="server" TargetControlID="txtPeriodTo" Format="dd/MM/yyyy" />

								</div>
							   
								
							</div>
						</div>

					</div>

Here's my SelectedIndexChange of the dropdownlist

protected void rdoPeriodChange_SelectedIndexChanged(object sender, EventArgs e)
        {
            var rdoSender = (DropDownList)sender;
            GridViewRow gvRowContainer = (GridViewRow)rdoSender.Parent.Parent.Parent.Parent;

            HtmlGenericControl divPeriod = (HtmlGenericControl)gvRowContainer.FindControl("divPeriod");

            var classes = divPeriod.Attributes["class"].Split(' ');

            if (rdoSender.SelectedValue=="0")
            {
                var updated = classes.Where(x => x != "d-block").ToArray();
                divPeriod.Attributes["class"] = string.Join(" ", updated);
            }
            else
            {
                var updated = classes.Where(x => x != "d-none").ToArray();
                divPeriod.Attributes["class"] = string.Join(" ", updated);
                
            }
        }

What I have tried:

Here's the image
GridView Image

I did try to put a stack trace, the breakpoints work on Row Index 0, but it does not on other row index