Filter Repeater with Dropdown (Asp.net/C#)

Question

I Have a repeater which connects to an access database. The repeater pulls the information in using <%# Eval("text") %> commands and an AccessDataSource.

I am able to display the inital data fine, however I want to be able to filter the records using a series of dropdownlists. For example to be able to list only cars by "Make" "Year" "Colour". I have been able to filter the data how I want, but this is by displaying it in a second repeater and using another AccessDataSource. Ideally I would like to use just the one repeater which updates accordingly.

Any suggestions? Thanks.

<asp:AccessDataSource ID="AccessDataSource1" runat="server" 
DataFile="~/App_Data/Cars.accdb" 
SelectCommand="SELECT * FROM [Cars]">
</asp:AccessDataSource>


<asp:AccessDataSource ID="AccessDataSource2" runat="server"
    DataFile="~/App_Data/Cars.accdb" 
       SelectCommand="SELECT Make, [Year], Model, Colour, Artwork, Type, WHERE (Colour = ?)">
<SelectParameters>
    <asp:ControlParameter ControlID="ColourDropdown" Name="Colour" PropertyName="SelectedValue" Type="String" />
</SelectParameters>
</asp:AccessDataSource>




<asp:DropDownList ID="GenreDropdown" runat="server" 
     DataSourceID="AccessDataSource1" DataTextField="Colour" DataValueField="Colour"
     AppendDataBoundItems="True" CssClass="form-control"  DataMember="DefaultView"       AutoPostBack="True" >
<asp:ListItem Value="%"</asp:ListItem>
</asp:DropDownList>




<asp:Repeater ID="Repeater2" runat="server" DataSourceID="AccessDataSource1">
<ItemTemplate>
        <div class="row list-group-item active">
            <div class="col-xs-2">         
            <p class="list-group-item-text active"><img src="carimages/<%#Eval("Artwork")%>" /></div>
            <div class="col-xs-4">    
            <h4 class="list-group-item-heading"><%# Eval("Make")%> (<%# Eval("Year") %>)</h4>
            <p class="list-group-item-text"><%# Eval("Model")%></p>
            <p class="list-group-item-text"><%# Eval("Colour")%></p>
            <p class="list-group-item-text"><%# Eval("Type")%></p></div>
            <div class="col-xs-4"> 
            </div>
          </a>
            </div>
</ItemTemplate>
</asp:Repeater>   



<asp:Repeater ID="Repeater3" runat="server" DataSourceID="AccessDataSource2">
<ItemTemplate>
        <div class="row list-group-item active">
            <div class="col-xs-2">         
            <p class="list-group-item-text active"><img src="carimages/<%#Eval("Artwork")%>" /></div>
            <div class="col-xs-4">    
            <h4 class="list-group-item-heading"><%# Eval("Make")%> (<%# Eval("Year") %>)</h4>
            <p class="list-group-item-text"><%# Eval("Model")%></p>
            <p class="list-group-item-text"><%# Eval("Colour")%></p>
            <p class="list-group-item-text"><%# Eval("Type")%></p></div>
            <div class="col-xs-4"> 
            </div>
          </a>
            </div>
</ItemTemplate>
</asp:Repeater> 

Answer 1

For this you need to add parameters to the data source dynamically (that is in code behind) rather than decoratively. So in markup you should leave this (guess it was your original layout):

<asp:AccessDataSource ID="AccessDataSource1" runat="server" 
     DataFile="~/App_Data/Cars.accdb" 
     SelectCommand="SELECT * FROM [Cars]">
</asp:AccessDataSource>

<asp:DropDownList ID="GenreDropdown" runat="server" 
     DataSourceID="AccessDataSource1" DataTextField="Colour" DataValueField="Colour"
     AppendDataBoundItems="True" CssClass="form-control"  DataMember="DefaultView"       AutoPostBack="True" >
    <asp:ListItem Value="%"></asp:ListItem>
</asp:DropDownList>

<asp:Repeater ID="Repeater2" runat="server" DataSourceID="AccessDataSource1">
<ItemTemplate>
        <div class="row list-group-item active">
            <div class="col-xs-2">         
            <p class="list-group-item-text active"><img src="carimages/<%#Eval("Artwork")%>" /></div>
            <div class="col-xs-4">    
            <h4 class="list-group-item-heading"><%# Eval("Make")%> (<%# Eval("Year") %>)</h4>
            <p class="list-group-item-text"><%# Eval("Model")%></p>
            <p class="list-group-item-text"><%# Eval("Colour")%></p>
            <p class="list-group-item-text"><%# Eval("Type")%></p></div>
            <div class="col-xs-4"> 
            </div>
          </a>
            </div>
</ItemTemplate>
</asp:Repeater>

And in code behind, say on page load, do this:

AccessDataSource1.SelectParameters.Add("Colour", GenreDropdown.SelectedValue);
Repeater2.DataBind();

Answer 2

you may bind to each dropdown a call to a function which retrieve data on selectedindexchanged event and re.bind your datarepeater the logic on this stuff depend from your final goal

UPDATE THIS IS A SAMPLE ADAPT IT TO YOUR LOGIC

 Private Sub ddlsomethinhg_SelectedIndexChanged(sender As Object, e As EventArgs) Handles ddlsomethinhg.SelectedIndexChanged
    //ASSUME INDEX 0 IS NOT VALID VALUE
    If ddlsomethinhg.SelectedIndex = 0 Then
        Exit Sub
    Else
        //ASSUME THAT IS INTEGER
        Dim SEARCHVALUE As Integer = CInt(ddlsomethinhg.SelectedValue)
        Dim QRY As String = String.Format("select * from TABLE where colname={0}", SEARCHVALUE)
        Using cnn As New OleDbConnection("CONNECTIONSTRING")
            If cnn.State = ConnectionState.Closed Then cnn.Open()
            Using CMD As New OleDbCommand(QRY, cnn)
                Using da As New OleDbDataAdapter(CMD)
                    Using ds As New DataSet
                        da.Fill(ds)
                        //if repeater2 is bounf in aspx page you will throw an exceptio so before you need to clean up datasource
                        Dim r As New Repeater
                        Repeater2.DataSourceID = ""
                        Repeater2.DataSource = ds.Tables(0)
                        Repeater2.DataBind()
                    End Using
                End Using
            End Using

        End Using
    End If
End Sub