Working on a web forms project with a Master Page implementation, I have added the following code in my content place holder.
<asp:RadioButtonList ID="ckbLstPartner" runat="server" name="ckbLstPartner"
RepeatDirection="Horizontal"
CssClass="cssRdlstMoheSacm" Height="85px" Width="430px">
<asp:ListItem Text="Yes" Value="1"></asp:ListItem>
<asp:ListItem Text="No" Value="0"></asp:ListItem>
</asp:RadioButtonList>
<br />
<asp:TextBox ID="trSetPartnerNamesAvailability" value="trSetPartnerNamesAvailability" runat="server"></asp:TextBox>
<asp:TextBox ID="trSetPartnerInfoAvailability" value="trSetPartnerInfoAvailability" runat="server"></asp:TextBox>
<br />
<br />
<asp:TextBox ID="txtPartnersName" value="txtPartnersName" runat="server"></asp:TextBox>
<asp:TextBox ID="txtReqScoreCourseAccept" value="txtReqScoreCourseAccept" runat="server"></asp:TextBox>
<asp:TextBox ID="txtCourseAcceptNote" value="txtCourseAcceptNote" runat="server"></asp:TextBox>
Additionally, I am utilizing Javascript to add some functionality.
JAVASCRIPT CODE:
$(document).ready(function () {
$('#<%=ckbLstPartner.ClientID %>').change(function () {
if ($("input[name='<%=ckbLstPartner.ClientID %>'][value='1']").prop("checked")) {
$('#<%=trSetPartnerNamesAvailability.ClientID%>').show();
$('#<%=trSetPartnerInfoAvailability.ClientID%>').show();
}
else {
$('#<%=trSetPartnerNamesAvailability.ClientID%>').hide();
$('#<%=trSetPartnerInfoAvailability.ClientID%>').hide();
$('#<%= txtPartnersName.ClientID %>').val('');
$('#<%= txtReqScoreCourseAccept.ClientID %>').val('');
$('#<%= txtCourseAcceptNote.ClientID %>').val('');
}
});
});
Upon running the application, the radio button list is displayed as shown below
BROWSER OUTPUT:
<table id="ContentPlaceHolder1_ckbLstPartner" class="cssRdlstMoheSacm" style="height:85px;width:430px;">
<tr>
<td><input id="ContentPlaceHolder1_ckbLstPartner_0" type="radio" name="ctl00$ContentPlaceHolder1$ckbLstPartner" value="1" /><label for="ContentPlaceHolder1_ckbLstPartner_0">Yes</label></td><td><input id="ContentPlaceHolder1_ckbLstPartner_1" type="radio" name="ctl00$ContentPlaceHolder1$ckbLstPartner" value="0" /><label for="ContentPlaceHolder1_ckbLstPartner_1">No</label></td>
</tr>
</table>
<br />
<input name="ctl00$ContentPlaceHolder1$trSetPartnerNamesAvailability" type="text" id="ContentPlaceHolder1_trSetPartnerNamesAvailability" value="trSetPartnerNamesAvailability" />
<input name="ctl00$ContentPlaceHolder1$trSetPartnerInfoAvailability" type="text" id="ContentPlaceHolder1_trSetPartnerInfoAvailability" value="trSetPartnerInfoAvailability" />
<br />
<br />
<input name="ctl00$ContentPlaceHolder1$txtPartnersName" type="text" id="ContentPlaceHolder1_txtPartnersName" value="txtPartnersName" />
<input name="ctl00$ContentPlaceHolder1$txtReqScoreCourseAccept" type="text" id="ContentPlaceHolder1_txtReqScoreCourseAccept" value="txtReqScoreCourseAccept" />
<input name="ctl00$ContentPlaceHolder1$txtCourseAcceptNote" type="text" id="ContentPlaceHolder1_txtCourseAcceptNote" value="txtCourseAcceptNote" />
<br />
Due to these changes, my javascript code is not functioning properly (Specifically "
if ($("input[name='<%=ckbLstPartner.ClientID %>'][value='1']").prop("checked")) {}When implementing the same logic in webforms without using a Master Page, everything works fine.
Thanks & Regards