ASP.NET DropDownList not retaining selected item on postback

Question

I have an ASP DropDownList that gets populated on the Page_Load event, after i select an item and hit a button the selected item gets cleared and the first item in the DropDownList gets selected. (The DropDownList is only populated when the page is not postback)

if (!IsPostBack)
{
    List<Country> lCountries = new List<Country>();
    List<CompanySchedule> lCompanySchedules = new List<CompanySchedule>();
    this.Load_Countries(lCountries);
    this.Load_Schedules(lCompanySchedules);
    if (personnelRec == null) 
    { 
        personnelRec = new Personnel(); 
    }
    if (Request.QueryString["UA"] != null && Convert.ToInt32(Request.QueryString["UA"].ToString()) > 0)
    {
        userAccount.ID = Convert.ToInt32(Request.QueryString["UA"].ToString());
        App_Database.Snapshift_Select_Helper.SNAPSHIFT_SELECT_PERSONNEL_APP_ACCOUNT(ref userAccount);
    }

    this.imgEmployeePicture.ImageUrl = "./images/Employees/nophoto.gif";
    if (Request.QueryString["EI"] != null && Convert.ToInt32(Request.QueryString["EI"].ToString()) > 0)
    {
            this.Load_PersonnelRec(Convert.ToInt32(Request.QueryString["EI"].ToString()));
    }
    else
    {
        this.lblChangeDirectionHead.Enabled = false;
        this.lblChangeDirections.Enabled = false;
        this.lbSchedules.Disabled = true;
    }
}

Solution 1

The page lifecycle does the following (plus other steps irrelevant to your question):

1. OnInit
2. Populate controls from ViewState (during postback)
3. Set the selected values (during postback)
4. Page_Load

You need to have ViewState enabled so it can populate the list before it "selects" the item. In this case, make sure you don't repopulate in Page_Load and lose the selected value. Do something like if (!IsPostback) { // Populate }

Otherwise, you have to populate the list manually in the OnInit event on every page request. Page_Load is too late in the lifecycle, so the selected item is lost.

Edit:

The DropDownList must also have valid values set (separate from the text displayed in the browser). This is done through the DataValueField property. Each value must be unique, otherwise only the first duplicate item will ever be selected. If you look at the HTML source in your browser, you should have:

<select>
    <option value="unique_value1">Displayed text1</option>
    <option value="unique_value2">Displayed text2</option>
</select>

The unique values are used for selecting the right item on the server side.

Solution 2

Are u using a Master Page? If so, remember to put the EnableViewState on true in the master page.

Comments

[mattgcon]

In the properties window the EnableViewState is set to true

[mattgcon]

The list DOES NOT repopulate on Postback, it is within a if (!IsPostBack) statement, therefore it only gets called once. See code above

[mattgcon]

Yes I have a breakpoint within the Page_Load and it only falls in that If statement once (on Page Load)

[Nelson Rothermel]

It's also possible ViewState has been disabled in web.config. Try checking ViewState with this tool to make sure it has your drop down values: testingreflections.com/node/view/3424

[mattgcon]

Ok on postback after the button is clicked I already know the items are still in the dropdownlist though

[Nelson Rothermel]

Can you check that before any of your Page_Load code runs? Does the dropdown have all the items there? I don't see why ViewState would populate the list and then the posted selected values wouldn't be set.

[Nelson Rothermel]

Not sure what else it could be. Does schedules by any chance depend on countries? If so, maybe countries is changing schedules and your selected schedule is lost. Other than that, I would recommend trying to simplify/comment out code to try to narrow it down. As long as the correct values are there after OnInit (whether through ViewState or manually populating), it should select it for you... which makes me think, are your list item values set correctly? If they aren't or 2 or more items have the same value, the first will be selected. You can check this in the HTML with view source.

[Nelson Rothermel]

...in other words, make sure you have a valid DataValueField set on the DropDownList and it's putting those values in the HTML. The displayed text is separate from the posted value, though you can make them the same. I bet you that's your problem.

[mattgcon]

nope the DataValueField and DataTextField are two seperate values and is stated as such by setting the respected properties to their respected values. I checked that first just to make sure. I have no idea why it is doing this. i am so frustrated right now because of it. Oh and those two dropdowns are independent of each other

[mattgcon]

Ok now I am getting the following: Invalid postback or callback argument. Event validation is enabled using <pages enableEventValidation="true"/> in configuration or <%@ Page EnableEventValidation="true" %> in a page

[Nelson Rothermel]

Did you check it in the generated HTML just to be sure? Never assume anything... :)

[mattgcon]

I have never heard of this before, none of my other forms have this problem in any other app and it is associated with the dropdownlist

[Nelson Rothermel]

Event validation makes sure the user doesn't send back an invalid (and potentially dangerous) value. The valid values are sent to the browser and back to the server as the __EVENTVALIDATION hidden field. Are you by any chance adding items to the dropdown on the client side (i.e. through JavaScript)?

[Nelson Rothermel]

I have found some weird bugs before in the standard controls, but I'm not aware of any on the DropDownList.

[mattgcon]

On the first time the page is loaded, within the view source it shows that the first option is set to selected (ie. <option selected="selected" value="1">) why do i have a feeling that the selected="selected" is causing the problem?

[Nelson Rothermel]

That should be fine. That's the default item that the browser will select when it renders the page. It shouldn't affect the selected value that is posted back.

[Nelson Rothermel]

To rule that out, you could use FireBug in Firefox, Developer Tools (resource tracking) in Chrome, or Fiddler to see what values are actually posted back to the server.

[Nelson Rothermel]

I would recommend creating a blank new page and only put the dropdown and if (!IsPostBack) { // Populate }. If that works, then it's probably some other code that is causing this. If it doesn't work, it may be a bug, or at least it would be easier to get it working eventually and figure out what was wrong.

[mattgcon]

Ok it is a damn dojo issue. The client wants me to use those controls and when I assigned the dropdownlist to dijit.form.ComboBox it messed it all up

[Nelson Rothermel]

So it ended up being JavaScript after all, though not what I expected. I wonder what Dojo is doing to it. If the ID and values aren't changed I would expect it to work. Oh well, at least you figured it out.

[suresh]

My pop up is using a normal div. Javascript code involved in opening the pop up and not inside the pop up.