asp.net - Dropdownlist hiding and showing panels

Question

I have created a Dropdown list with various options. Each option has a different result in a panel. Each panel has to stay hidden until there is an answer selected in de dropdown list. Depending on the answer one of the panels has to be shown and the others remain hidden. There is a possibility to change the answer which will result in changing the shown panel and hide the other panel.

The Dropdownlist:

<div class="form-row" style="margin-top:20px;">
    <label for="ddlAnswer">Answer the question</label>
        <asp:DropDownList ID="ddlAnswer" CssClass="form-control" runat="server"> 
            <asp:ListItem Disabled Selected>-Please select-</asp:ListItem>
            <asp:ListItem Text="Answer 1" Value="1" />
            <asp:ListItem Text="Answer 2" Value="2" />
            <asp:ListItem Text="Answer 3" Value="3" />
            <asp:ListItem Text="Answer 4" Value="4" />
        </asp:DropDownList>
    </div>

The panels:

<div class="form-row" style="margin-top:20px;">
<asp:Panel ID="pnl1" runat="server" Visible="false">
            Answer 1
        </asp:Panel>
<asp:Panel ID="pnl2" runat="server" Visible="false">
            Answer 2
        </asp:Panel>
<asp:Panel ID="pnl3" runat="server" Visible="false">
            Answer 3
        </asp:Panel>
<asp:Panel ID="pnl4" runat="server" Visible="false">
            Answer 4
</asp:Panel>    
</div>

I tried to use a Protected sub but somewhere a general error occurs when I used this .vb script.

Protected Sub DropDownList_Changed(ByVal sender As Object, ByVal e As EventArgs)
    If ddlAnswer.SelectedItem.Value = "1" Then
        pnl1.Visible = True
        pnl2.Visible = False
        pnl3.Visible = False
        pnl4.Visible = False
    Else
        pnl1.Visible = False
    If ddlAnswer.SelectedItem.Value = "2" Then
        pnl1.Visible = False
        pnl2.Visible = True
        pnl3.Visible = False
        pnl4.Visible = False
    Else
        pnl2.Visible = False
    If ddlAnswer.SelectedItem.Value = "3" Then
        pnl1.Visible = False
        pnl2.Visible = False
        pnl3.Visible = True
        pnl4.Visible = False
    Else
        pnl3.Visible = False
    If ddlAnswer.SelectedItem.Value = "4" Then
        pnl1.Visible = False
        pnl2.Visible = False
        pnl3.Visible = False
        pnl4.Visible = True
    Else
        pnl4.Visible = False
    End If
End Sub

What am I doing wrong?

EDIT: The error: Description: An application error occurred on the server. The current custom error settings for this application prevent the details of the application error from being viewed remotely (for security reasons). It could, however, be viewed by browsers running on the local server machine. Details: To enable the details of this specific error message to be viewable on remote machines, please create a tag within a "web.config" configuration file located in the root directory of the current web application. This tag should then have its "mode" attribute set to "Off".

Alse changed the If statements to Else If as suggested

Protected Sub DropDownList_Changed(ByVal sender As Object, ByVal e As EventArgs)
    If ddlAnswer.SelectedItem.Value = "1" Then
        pnl1.Visible = True
    Else If ddlAnswer.SelectedItem.Value = "2" Then
        pnl2.Visible = True
    Else If ddlAnswer.SelectedItem.Value = "3" Then
        pnl3.Visible = True
    Else If ddlAnswer.SelectedItem.Value = "4" Then
        pnl4.Visible = True
    Else
    pnl1.Visible = False
    pnl2.Visible = False
    pnl3.Visible = False
    pnl4.Visible = False
    End If
End Sub

question from:https://stackoverflow.com/questions/66045863/dropdownlist-hiding-and-showing-panels

Answer 1

Waitting for answers