I encountered a JavaScript
runtime error: Unable to get property 'style' of undefined or null reference
error while executing the code below.
The issue arises with this line of code:
lblSatisfyQuarterEndDate.style.display = "none";HTML
<div class="tdControl col-xl-6 nowrap">
<asp:DropDownList ID="ddlSatisfyQuarterEnd_ID" runat="server" onchange="dd_changed()" ClientIDMode="Static" >
<asp:ListItem Selected="True" Value="-1">-- Select one --</asp:ListItem>
<asp:ListItem Value="False">No</asp:ListItem>
<asp:ListItem Value="True">Yes</asp:ListItem>
</asp:DropDownList>
<asp:RequiredFieldValidator ID="RequiredFieldValidator3" runat="server" ControlToValidate="ddlSatisfyQuarterEnd_ID" CssClass="ValidatorFailedImage" Display="Dynamic" ToolTip="Is Required" InitialValue ="-1" />
</div>
</div>
<div class="col-xl-4 col-lg-4">
<div class="tdLabel col-xl-6 nowrap">
<asp:label ID="lblSatisfyQuarterEndDate" runat="server" Text=" Satisfy Quarter End Requirement Date:" />
</div>
<div class="tdControl col-xl-6 nowrap">
</div>
JavaScript
var ddlSatisfyQuarterEnd_ID = document.getElementById("ddlSatisfyQuarterEnd_ID").value;
var ddlSatisfyQuarterEndDate = document.getElementById("ddlSatisfyQuarterEndDate");
var lblSatisfyQuarterEndDate = document.getElementById("lblSatisfyQuarterEndDate");
function dd_changed() {
var ddlSatisfyQuarterEnd_ID = document.getElementById("ddlSatisfyQuarterEnd_ID").value;
switch (ddlSatisfyQuarterEnd_ID) {
case "True":
ddlSatisfyQuarterEndDate.style.display = "inline";
break;
case "False":
ddlSatisfyQuarterEndDate.style.display = "none";
lblSatisfyQuarterEndDate.style.display = "none";
break;
default:
ddlSatisfyQuarterEndDate.style.display = "none";