ASP.NET：我需要构建一个复选框侧边栏菜单来驱动查询以填充产品屏幕

Question

ASP.NET 新手；我想构建一个复选框侧边栏来驱动一个查询，该查询将填充产品屏幕......就像所附屏幕截图中的品牌菜单一样。

我已经让数据库正常工作，以及显示产品的产品屏幕。我的客户希望我添加此侧边栏品牌选择，以避免用户滚动浏览数百种产品。我正在使用 ASP.NET 和 MySQL 数据库。

我还想在顶部有一个全选按钮。

谢谢你。

我已经查看了许多有关该主题的视频，但没有任何内容可以帮助我解决这个问题。

Answer 1

很容易在左侧放入复选框列表，然后在右侧放入 GridView。

所以，说出这个标记：

    <div style="float: left; width: 10%">
        <h3>Select Cities</h3>
        <asp:Button ID="cmdAll" runat="server" Text="Select All"
            CssClass="btn"
            OnClick="cmdAll_Click" />

        <asp:Button ID="cmdClear" runat="server" Text="Clear All"
            CssClass="btn"
            Style="float: right"
            OnClick="cmdClear_Click" />

        <br />
        <br />

        <asp:CheckBoxList ID="chkCityList" runat="server"
            DataTextField="City"
            BackColor="LightGray"
            BorderWidth="4px"
            AutoPostBack="true"
            Width="100%"
            OnSelectedIndexChanged="chkCityList_SelectedIndexChanged">
        </asp:CheckBoxList>

    </div>

    <div style="float: left; margin-left: 30px; margin-top: 55px;width:40%">

        <asp:GridView ID="GVHotels" runat="server"
            AutoGenerateColumns="False"
            ShowHeaderWhenEmpty="true"
            DataKeyNames="ID" CssClass="table table-hover"
            >
            <Columns>
                <asp:BoundField DataField="FirstName" HeaderText="FirstName" />
                <asp:BoundField DataField="LastName" HeaderText="LastName" />
                <asp:BoundField DataField="City" HeaderText="City" />
                <asp:BoundField DataField="HotelName" HeaderText="Hotel" />
                <asp:BoundField DataField="Description" HeaderText="Description" />
            </Columns>
        </asp:GridView>

    </div>

背后的代码是：

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

    If Not IsPostBack Then
        LoadCheckBox
    End If

End Sub

Sub LoadCheckBox()

    Dim cmdSQL As New _
         SqlCommand("SELECT City FROM City ORDER BY City")

    chkCityList.DataSource = MyRstP(cmdSQL)
    chkCityList.DataBind()

End Sub

Protected Sub chkCityList_SelectedIndexChanged(sender As Object, e As EventArgs)

    Dim strSQL As String = "SELECT * FROM tblHotelsA "
    Dim strWhere As String = ""
    Dim cmdSQL As New SqlCommand
    Dim selCounter As Integer = 0

    For Each SelectedCity As ListItem In chkCityList.Items
        If SelectedCity.Selected Then

            If strWhere <> "" Then strWhere &= ","
            selCounter += 1
            cmdSQL.Parameters.Add($"@P{selCounter}", SqlDbType.NVarChar).Value = SelectedCity.Text
            strWhere &= $"@P{selCounter}"

        End If
    Next

    If strWhere <> "" Then
        strSQL &= "WHERE CITY IN (" & strWhere & ") AND Active = 1"
    End If

    strSQL &= "ORDER BY HotelName"

    Debug.Print(strSQL)

    cmdSQL.CommandText = strSQL
    GVHotels.DataSource = MyRstP(cmdSQL)
    GVHotels.DataBind()

End Sub

Protected Sub cmdAll_Click(sender As Object, e As EventArgs)

    ' select all check boxes
    ' (which really means no filter at all!

    For Each OneCheckBox As ListItem In chkCityList.Items
        OneCheckBox.Selected = True
    Next

    Dim strSQL As String =
        "SELECT * FROM tblHotelsA WHERE Active = 1 ORDER BY HotelName"
    Dim cmdSQL As New SqlCommand(strSQL)
    GVHotels.DataSource = MyRstP(cmdSQL)
    GVHotels.DataBind()

End Sub

Protected Sub cmdClear_Click(sender As Object, e As EventArgs)

    For Each OneCheckBox As ListItem In chkCityList.Items
        OneCheckBox.Selected = False
    Next

    Dim strSQL As String =
        "SELECT * FROM tblHotelsA WHERE ID = 0"
    Dim cmdSQL As New SqlCommand(strSQL)
    GVHotels.DataSource = MyRstP(cmdSQL)
    GVHotels.DataBind()


End Sub

结果是这样的：

我的一个全局助手例程 MyrstP 是：

Public Function MyRstP(cmdSQL As SqlCommand, Optional strCon As String = "") As DataTable
    ' general get any data from SQL command
    If strCon = "" Then strCon = GetConStr()

    Dim rstData As New DataTable
    Using conn As New SqlConnection(strCon)
        Using (cmdSQL)
            cmdSQL.Connection = conn
            conn.Open()
            rstData.Load(cmdSQL.ExecuteReader)
        End Using
    End Using

    Return rstData

End Function