I have an aspx page that contains an ASPxComboBox. When this combo is changed after the page loads the div hides/unhides fine. In my case I load existing values from the database. I need to hide/show div based on these loaded values. If I populate the dropdown with "None" I want to hide the divs. Thanks.
< script type = "text/javascript" >
function OnSizeChanged(cbSide) {
const str = cbSide.GetText().toString();
if (str.includes('None')) {
bottomtext.style.display = "block";
lblbottomtext.style.display = "block";
} else {
lblbottomtext.style.display = "none";
bottomtext.style.display = "none";
}
}
</script><dx:ASPxComboBox ID="cbSide" runat="server" Width="280" ValueType="System.String">
<Items>
<dx:ListEditItem Text="DXF" Value="DXF" />
<dx:ListEditItem Text="None" Value="None" />
</Items>
<ClientSideEvents SelectedIndexChanged="function(s, e) { OnSizeChanged(s); }" />
<ValidationSettings RequiredField-IsRequired="true" Display="Dynamic">
<RequiredField IsRequired="True"></RequiredField>
</ValidationSettings>
</dx:ASPxComboBox>
<div id="lblbottomtext" runat="server">
<dx:ASPxLabel ID="lblBST" runat="server" Text="Bottom Side Text:"></dx:ASPxLabel>
</div>
<div id="bottomtext" runat="server">
<dx:ASPxMemo ID="txtBottom" runat="server" Height="71px" Width="280px"></dx:ASPxMemo>
</div>