Question

This seems like a common scenario with an obvious solution, but somehow I haven’t encountered it.

I have a DropDownList with an event handler bound to the SelectedIndexChanged event and AutoPostback="true", which works as intended.

The event handler is executed when the value has changed, but if the value is changed via script using jQuery on the client-side, and a post back is subsequently triggered when the user changes the value (and the drop-down’s onchange event fires), then the server-side code detects that the value hasn’t changed since the server last saw its state, and therefore the event handler isn’t run on the server side.

It seems like something that would be loaded via view state, but disabling ViewState has no effect.

1. The page renders the drop-down with the value “A” selected.
2. The user changes the drop-down list to value “B”.
3. The value is automatically posted to the server, and the SelectedIndexChanged event handler is executed.
4. A client script is run to change the value on the client back to “A” using jQuery.val().
5. The user changes the value back to “B”.
6. The value is automatically posted to the server, but because the value was “B” when the server last rendered the page, the SelectedIndexChanged event handler is not executed.

Client-side

<asp:DropDownList ID="dlst" runat="server" AutoPostBack="true" OnSelectedIndexChanged="dlst_SelectedIndexChanged">
    <asp:ListItem Text="A" Value="A" />
    <asp:ListItem Text="B" Value="B" />
</asp:DropDownList>

<asp:Button ID="btnChange" runat="server" Text="Change" OnClientClick="return changeDDL(this,event)" />
<script type="text/javascript">
    function changeDDL(sender, e) {
        var dlst = $("#<%= dlst.ClientID %>");
        dlst.val(dlst.val() === "A" ? "B" : "A");
        return false;
    }
</script>

Server-side

protected void dlst_SelectedIndexChanged(object sender, EventArgs e)
{
    btnChange.Text = dlst.SelectedValue == "A" ? "Change B" : "Change A";
}

Answer 1

After debugging the .Net Framework Reference Source, I’ve concluded the problem is deep in the DropDownList implementation, and can’t be remedied without reimplementing or inheriting the class to change the behavior.

In the DropDownList class, there is a LoadPostData() implementation of the IPostBackDataHandler interface method.

Inside LoadPostData(), the index of the value currently selected in the drop-down is compared against the SelectedIndex property that is either loaded from ViewState or defaulted to 0 when EnableViewState="false" is set on the drop-down.

The OnSelectedIndexChanged() method is called by the RaisePostDataChangedEvent(), which, as the name indicates, is only called if the post data has changed in comparison to the viewstate/default data. Therefore, if the currently selected index matches the viewstate/default index, the SelectedIndexChanged event doesn’t fire.

In my case, two things can cause the issue:

1. With ViewState enabled, the current index value matches the SelectedIndex value loaded from ViewState, so SelectedIndexChanged doesn’t fire.
2. With ViewState disabled, the SelectedIndex value is defaulted to 0, so when the current index value is 0, SelectedIndexChanged doesn’t fire.

DropDownList.LoadPostData()

protected virtual bool LoadPostData(String postDataKey, NameValueCollection postCollection) { 
    //{snip...}
    int n = Items.FindByValueInternal(selectedItems[0], false);

    if (SelectedIndex != n) {
        SetPostDataSelection(n); // Calls ListControl.SetPostDataSelection() and sets Items[selectedIndex].Selected = true;
        return true;
    } 

    return false; 
}

Later, when the Page class is going through the controls whose post data has changed, the drop-down’s OnSelectedIndexChanged method is called if a change was detected. Since the drop-down’s post data hasn’t changed in this case, the event isn’t raised.

DropDownList.RaisePostDataChangedEvent()

protected virtual void RaisePostDataChangedEvent() { 
    //{snip...}
    OnSelectedIndexChanged(EventArgs.Empty); 
}