AjaxControlToolkit ComboBox Selected Value Manual Reset Not Working in asp.net c#

Question

I am using AjaxControlToolkit combo box. On the page load I have set the selected value to the combo box. After page loaded successfully, I have cleared combo box selected value in text box of combo box manually.The selected value not changed to empty or null.

Now the textbox of combo box is empty, but it keeps the old selected value.

How can I set the selected value to null, when the user changes the selected value to empty?

 <ajaxToolkit:ComboBox    ID="cmbTest" AppendDataBoundItems="false"  ClientIDMode="Static"  AutoPostBack="false"   MaxLength="64" Width="600px" runat="server" AutoCompleteMode="SuggestAppend">
            </ajaxToolkit:ComboBox>

Answer 1

You never get a "null" value.

However, the ajax combo DOES WORK different, and it quite much has a bug in the sense that

A regular dropdown list ALWAYS defaults to the FIRST choice in the list.

The ajax dropdown does NOT start out with the first value, and the selected index starts out as -1.

(you get empty strings for the Text, and selected value).

In fact FEW people ever notice a issue/probelm, then they NEAR ALWAYS had to add a blank row choice to the standard combo box (else as noted it selects by default the first row). Since that THEN means the user can NEVER select a blank value?

Then we quite much ALWAYS added the blank choice.

And since we ALWAYS had to do that, then when we say jumped over to using the ajax one?

Well, we had that blank choice default setup by habit.

However, the ajax combo has somewhat different behavior.

It starts out (by default) with a blank selection - EVEN if you don't set one. The selected index will thus be -1.

However, if a user selects a value, and then say later decides to blank out their selection? The combo box IGNORE this and you see (with a post-back) the combo box reverts back to the previous selection.

How to fix?

Just do what we had to AWAYS do for a regular dropdown - PROIVDE the blank row selection. I can't really say this is a bug, but it is "some what" of a issue. (in fact, I would go so far as to say this is a bug in behaviors, and blanking out the combo box SHOULD revert to selectedIndex = -1, but it DOES NOT.

However, to fix, simple do what we always did for regular dropdowns - provide a blank selection for the combo box.

This DOES mean that on page startup, the combo box will show -1 (no selection). Now, if they select - ok all is normal. However, if they erase/blank out, then you going to get "0" for the index - you can't revert it back to no value by just erasing the contents. (you can set -1 in code, but I would not worry).

So, typical load up code will look like this:

(I don't have ac# setup for ajaxtool kit, but regardless, I suggest this:

Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
    If Not IsPostBack Then
        LoadData
    End If
End Sub

Sub LoadData()

    Using con As New SqlConnection(My.Settings.TEST4)

        Using cmdSQL As New SqlCommand("SELECT ID, City from City ORDER BY City", con)

            con.Open()
            Dim rstData As New DataTable

            rstData.Load(cmdSQL.ExecuteReader)

            DropDownList1.DataSource = rstData
            DropDownList1.DataBind()
            DropDownList1.Items.Insert(0, New ListItem("", ""))

            ComboBox1.DataSource = rstData
            ComboBox1.DataBind()
            ComboBox1.Items.Insert(0, New ListItem("", ""))


        End Using
    End Using

End Sub

So, in above, I just loaded up a regular asp.net dropdown, and then the ajax one.

Note in both cases, I ADD A BLANK selection here.

So, NOW if the user does erase the selection to blank? Then it will select row 0 for you.

IF YOU DO NOT provide the blank row into the data that drives the ajax combo?

Then yes, you will experience that erasing the combo box is considered NOT a change to the current selected value. And you note in code, the older index value remains, and in fact AFTER a post back, you see the ajax combo revert back to the previous (current) selected value.

So, bottom line?

Add a blank row value/selecting to the list. We NEAR ALWAYS had to do that with a regular dropdown list, so when we jumped over to ajax combo, we just always did the same thing (this explains WHY so few see your bug/issue).

So, if you don't provide a blank row choice to the ajax combo, then in effect you can't blank out the choice. And the "really bad" part is that EVEN if you do erase the choice (back space key, or highlight + cut), then it goes blank, but blank is seen by the combo box as no change.

I don't know if there is a property or setting that can fix the above, but as noted, the solution is to always provide a blank choice in the data that drives the combo box.

You lucky, and so are most, since in 99% of cases, we want a blank allowable value. The house of cards in fact ONLY comes really crashing down if you do NOT want to allow a blank selection! (you can't stop the user from erase/empty the combo box, but that act does not actually blank out or re-set the combo box to a selected index of -1 (which it should)).

If you fill that combo box (it works much the same as a regular dropdown), then you have to provide a blank/empty choice. In other words, the combo defaults to the FIRST item in the list. And as a general rule, you thus can't erase/blank out the combo box.

so, to fix/manage this, then insert a blank row value at position 0 as per the sample code. We always quite much had to do this with a regular dropdown list, so not a big deal for the ajax combo, but it most certainly is big deal if you DO NOT add the blank choice to the ajax combo, since a user can erase the value - and the combo box does not actually change its selection UNLESS you have that blank row as part of the data that drives the combo box.