user1678946
user1678946

Reputation:

HTML Select Not Showing Selected Option After Refresh in Firefox

TL,DR: Firefox (and only Firefox) fails to display the right select child element as marked with selected="selected" upon clean refresh of a page, even though it is correct in DOM (but only under certain conditions).

(I do not believe this is a duplicate of HTML select, correct option selected in DOM, but wrong item shown in firefox as I am not using ember.js.)


Background

I'm building a "software management/update server" in ASP.NET WebForms. It stores master copies of applications and serves downloads and updates via a simple API. Each application (or "App" as they're referred to in-code) has a DeptID and a GroupID, which are GUIDs, relating to respective Dept and Group tables. Each Group has a DeptID field also.

On one particular page, used for editing a chosen software application's details, NON-postback requests (.e.g., http://localhost/admin/app/edit.aspx?id=guid-here) will result in calls to the database to populate field data on the page.

In brief, the ASP.net runtime Page_Load event does the following:

Important to Note: When you click Save, the page is posted back to the server and field data dumped into the database. If the save operation is successful, the browser is instructed to redirect to the current page's URL using Response.Redirect(Request.Url.ToString), resulting in a "clean load" (non-postback load) of the page.


Expected Behavior:

After the page has been successfully saved, hitting F5 or clicking refresh should result in another clean load (non-postback) of the page, and all fields should be populated just like a direct URL hit on the page.


Actual Behavior:

After the page has been successfully saved, hitting F5 or clicking refresh reloads the page as a non-postback (verified in VS debug), but the ddlGroup select element renders the "default" / first item ("Select One") instead of the item marked selected="selected" in the DOM.

I have stepped through every single line of VB code in debug — and when the server sends the page back after this "post-save" and supposedly "clean" load, the ddlGroup value is correct in code all the way out the door. Only in the browser, and only Firefox specifically, is the displayed value set to the wrong item, even though it's right in the DOM. Refreshing again doesn't help at all. When I try to save again, the RequiredField validator for ddlGroup complains that the field isn't valid, even though, again, it's supposedly right in DOM.

This seems to me to be a very bad Firefox bug.

Thoughts?

Upvotes: 5

Views: 2031

Answers (1)

user1678946
user1678946

Reputation:

So, this isn't really what I consider a proper "solution," but rather more of a stable work-around.

Adding autocomplete="off" to the offending select (DropDownList in the aspx markup) magically prevents Firefox from messing up the displayed element within the select, thus always showing the correct one that is marked selected="selected".

I've gone ahead and added it (and will add it) to all of my DropDownLists / selects from now on... thanks Firefox.

Upvotes: 7

Related Questions