面板可见性 asp.net

Panel visibility asp.net

请原谅我,因为这是我的第一个 post,我远非精通 IT,但我一直在为我的新工作做一个项目...

我正在使用 Visual Studio 2017 和 asp.net Web 表单模板。

我将几个面板的可见性设置为 false,并将每个面板设置为仅当从复选框列表中选择了某个选项时才可见。

我已经成功地对可见性进行了编码,但是当从复选框列表中选择了多个项目时,我希望允许用户查看多个面板...不幸的是,看起来好像只有一个面板变得可见一次。我假设它们是重叠的。

我曾尝试将每个面板放在 table 中作为一种占位符,但没有成功。

任何建议将不胜感激

aspx.vb

Protected Sub ListBox1_Changed(ByVal sender As Object, ByVal e As EventArgs) 句柄 ListBox1.SelectedIndexChanged

    If ListBox1.SelectedValue = "AA" Then

        Panel1.Visible = True

    Else
        Panel1.Visible = False

如果ListBox1.SelectedValue = "BB" 或 ListBoxLivewell.SelectedValue = "CC" 或 ListBoxLivewell.SelectedValue = "DD" 那么

        Panel2.Visible = True

    Else

        Panel2.Visible = False

    End If

我建议您创建空白测试页,然后试试这个:

标记:

        <asp:CheckBox ID="CheckBox1" runat="server" Text="Panel1" AutoPostBack="true" />
        <asp:CheckBox ID="CheckBox2" runat="server" Text="Panel2" AutoPostBack="true" />
        <asp:CheckBox ID="CheckBox3" runat="server" Text="Panel3" AutoPostBack="true" />

        <asp:Panel ID="Panel1" runat="server">
            <h2>Panel 1</h2>
        </asp:Panel>

        <asp:Panel ID="Panel2" runat="server">
            <h2>Panel 2</h2>
        </asp:Panel>

        <asp:Panel ID="Panel3" runat="server">
            <h2>Panel 3</h2>
        </asp:Panel>

隐藏代码:

Protected Sub CheckBox1_CheckedChanged(sender As Object, e As EventArgs) Handles CheckBox1.CheckedChanged

    ' we could use this one line
    ' Panel1.Visible = CheckBox1.Checked
    ' or

    If CheckBox1.Checked Then
        Panel1.Visible = True
    Else
        Panel1.Visible = False
    End If

End Sub


Protected Sub CheckBox2_CheckedChanged(sender As Object, e As EventArgs) Handles CheckBox2.CheckedChanged

    Panel2.Visible = CheckBox2.Checked

End Sub

Protected Sub CheckBox3_CheckedChanged(sender As Object, e As EventArgs) Handles CheckBox3.CheckedChanged

    Panel3.Visible = CheckBox3.Checked

End Sub

我们得到这个:

请注意,由于页面刚刚加载,所以我的复选框代码 NONE 有 运行。事实上,如果我选中一个框,我会得到:

所以,实际上要隐藏面板 1,我现在可以 un-check 第一个框,并得到这个:

请注意面板是如何“不同步”的,因为我在启动时并没有真正检查或对面板做任何事情,因此它们没有反映正确的状态。

事实上,直到我检查,un-check 所有 3 个,然后在那时,它们都工作正常。

所以,这样做可能更好。

在第一页加载时(并且仅在第一次加载时),我会这样做:

Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load

    If Not IsPostBack Then
        ShowPans()
    End If

End Sub

Sub ShowPans()

    Panel1.Visible = CheckBox1.Checked
    Panel2.Visible = CheckBox2.Checked
    Panel3.Visible = CheckBox3.Checked

End Sub

所以,现在在第一页加载时 - 我 hide/show 基于复选框代码的面板,现在一切都开始正确地“同步”

尝试用上面的方法测试空白页,但隐藏和显示面板应该可以。

请注意,在许多情况下,最好 hide/show 面板而不使用可见。这样做的原因是任何标记为 visibile = false 的控件都不会发送到浏览器。如果您有一些客户端 JavaScript 运行 宁,或做事,他们将无法看到,也不会参考那些面板。

所以,在很多情况下,最好隐藏起来,而不是使用 Visible=false。如前所述,如果您使用客户端 JavaScript 来操纵此类控件,这是非常必要的。

因此,我们的代码现在会变成这样:

Protected Sub CheckBox1_CheckedChanged(sender As Object, e As EventArgs) Handles CheckBox1.CheckedChanged

    If CheckBox1.Checked Then
        Panel1.Style("display") = "normal"
    Else
        Panel1.Style("display") = "none"
    End If
End Sub


Protected Sub CheckBox2_CheckedChanged(sender As Object, e As EventArgs) Handles CheckBox2.CheckedChanged

    If CheckBox2.Checked Then
        Panel2.Style("display") = "normal"
    Else
        Panel2.Style("display") = "none"
    End If
End Sub

Protected Sub CheckBox3_CheckedChanged(sender As Object, e As EventArgs) Handles CheckBox3.CheckedChanged

    ' same as above 2 - but short hand code
    Panel3.Style("display") = IIf(CheckBox3.Checked, "normal", "none")

End Sub

现在,如果您使用 say JavaScript 客户端,您只需要执行上述操作 - 我只是想说明一下,使用 Visible 通常会成为一个问题,因为如前所述,visible = false 表示控件既不发送也不呈现浏览器端 - 当我开始写很多 JavaScript.

时,我花了一整天的时间学习这个错误

到目前为止,这看起来是 100% 服务器端代码,因此您可以使用 .Visible。

但是,做一个快速的小测试网页 - 试试上面的 - 确保它有效,然后再试一次你的代码。