UpdatePanel not updating ListBox

Question

I have an UpdatePanel containing a ListBox. Whenever I change selection on from a DropDown I want the list to get updated via an UpdatePanel. However this is not working.

This is my code so far:

 Protected Sub drpDepartments_SelectedIndexChanged(sender As Object, e As EventArgs) Handles drpDepartments.SelectedIndexChanged

        Dim conn As New SqlConnection("Data Source=BRIAN-PC\SQLEXPRESS;Initial Catalog=master_db;Integrated Security=True")
        Dim deptComm As String = "SELECT department_id FROM departments WHERE department_name = @DepartmentName"

        Dim deptSQL As New SqlCommand
        Dim dr As SqlDataReader = deptSQL.ExecuteReader()

        deptSQL = New SqlCommand(deptComm, conn)
        deptSQL.Parameters.AddWithValue("@DepartmentName", drpDepartments.SelectedItem.Text)

        dr.Read()

        If dr.HasRows Then


            Dim department_id As Integer = Convert.ToInt32(dr("department_id"))
            Session("DepartmentID") = department_id

        End If

        dr.Close()
        conn.Close()

ASP

 <asp:UpdatePanel ID="UpdatePanel2" runat="server">
                    <ContentTemplate>
                        <asp:ListBox ID="lstDeptMembers" runat="server" DataSourceID="SqlDataSource4" DataTextField="name" DataValueField="name" Height="176px" Width="204px"></asp:ListBox>
                    </ContentTemplate>
                    <Triggers>
                        <asp:AsyncPostBackTrigger ControlID="drpDepartments" EventName="SelectedIndexChanged" />
                    </Triggers>
                </asp:UpdatePanel>

                <asp:SqlDataSource ID="SqlDataSource4" runat="server" ConnectionString="<%$ ConnectionStrings:ConnStringDb1 %>" SelectCommand="SELECT * FROM users u
INNER JOIN 
(
Select x.user_id as userid,x.department_id,y.department_name
 from user_Department x 
inner join departments y 
on x.department_id=y.department_id WHERE x.department_id=@parameter
) 
    f on u.user_id= f.userid">
                    <SelectParameters>
                        <asp:SessionParameter Name="parameter" SessionField="DepartmentID" />
                    </SelectParameters>
                </asp:SqlDataSource>

DropDownList:

 <asp:DropDownList ID="drpDepartments" runat="server" DataSourceID="SqlDataSource3" DataTextField="department_name" DataValueField="department_name">
</asp:DropDownList>
<asp:SqlDataSource ID="SqlDataSource3" runat="server" ConnectionString="<%$ ConnectionStrings:ConnStringDb1 %>" SelectCommand="SELECT [department_name] FROM [departments]"></asp:SqlDataSource>

Screenshot:

How can I make it that the ListBox updates whenever a new selection is clicked from the DropDown ?

EDIT: Code for the table that contains the ListBox etc.. :

<asp:DropDownList ID="drpDepartments" runat="server" DataSourceID="SqlDataSource3" DataTextField="department_name" DataValueField="department_name">
    </asp:DropDownList>
    <asp:SqlDataSource ID="SqlDataSource3" runat="server" ConnectionString="<%$ ConnectionStrings:ConnStringDb1 %>" SelectCommand="SELECT [department_name] FROM [departments]"></asp:SqlDataSource>

    <br />

    <br />


     <table style="width:100%;">
            <tr>
                <td style="width: 221px">






                    <asp:UpdatePanel ID="UpdatePanel2" runat="server">
                        <ContentTemplate>
                            <asp:ListBox ID="lstDeptMembers" runat="server" DataSourceID="SqlDataSource4" DataTextField="name" DataValueField="name" Height="176px" Width="204px"></asp:ListBox>
                        </ContentTemplate>
                        <Triggers>
                            <asp:AsyncPostBackTrigger ControlID="drpDepartments" EventName="SelectedIndexChanged" />
                        </Triggers>
                    </asp:UpdatePanel>

                    <asp:SqlDataSource ID="SqlDataSource4" runat="server" ConnectionString="<%$ ConnectionStrings:ConnStringDb1 %>" SelectCommand="SELECT * FROM users u
    INNER JOIN 
    (
    Select x.user_id as userid,x.department_id,y.department_name
     from user_Department x 
    inner join departments y 
    on x.department_id=y.department_id WHERE x.department_id=@parameter
    ) 
        f on u.user_id= f.userid">
                        <SelectParameters>
                            <asp:SessionParameter Name="parameter" SessionField="DepartmentID" />
                        </SelectParameters>
                    </asp:SqlDataSource>

                </td>
                <td style="width: 398px">


                    <asp:TextBox ID="txtuserSearch" runat="server"></asp:TextBox>
    &nbsp;&nbsp;&nbsp;&nbsp;
                    <asp:Button ID="btnSearchDeptUser" runat="server" Text="Search" />
                    <br />
                    <asp:Label ID="lblAddDeptUser" runat="server" Visible="False"></asp:Label>


                </td>

            </tr>
            <tr>
                <td >
                    <asp:Button ID="btnRmvDeptMem" runat="server" Text="Remove" />
                </td>
                <td>
                    <asp:Button ID="btnAddDeptUser" runat="server" Text="Add" />
                </td>

            </tr>

        </table>

Full code for Departments.aspx

Answer 1

try this... Change this

<asp:UpdatePanel ID="UpdatePanel2" runat="server">

with

 <asp:UpdatePanel ID="UpdatePanel2" runat="server" UpdateMode="Conditional">

Answer 2

If you want to update the UpdatePanel immediately when the user selects an item in the DropDownList you have to set it's AutoPostBack property to "True"(default is false):

<asp:DropDownList ID="drpDepartments" runat="server" DataSourceID="SqlDataSource3" 
    AutoPostack="True" DataTextField="department_name" DataValueField="department_name">
</asp:DropDownList>