Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Why does Chrome not show a selected <option> element after using the back button?

I have a <select> tag that contains a single <option> element:

<select id="someselect">
  <option value="2">B</option>
</select>

The single <option> is later replaced using jQuery. The new list of options always contains the old option:

selected = $('#someselect').val();
$('#someselect').html('<option value="1">A</option><option value="2">B</option>').val(selected);

This works as expected. However, when navigating away from the webpage in Google Chrome and then clicking the back button, something weird happens. The select tag is back to its initial state (makes sense), but the single <option> element is not selected!

What is the cause of this behavior in Chrome?

I've created a minimal working example: http://dl.dropbox.com/u/27566470/backdemo.html
Initially there is only a single <option>. First click on "click" to replace the options (but keep the 'B' option selected), then click on "Google" to navigate away, and then use the back button of Chrome to see the <select> tag with only a single option that is not selected.

Edit: to clarify, I'm not interested in how to fix this. I'm curious why Chrome works like this. Serving the original (unmodified) DOM after using the back button makes sense, but why is the only select option not selected?

like image 368
Intru Avatar asked Apr 26 '12 13:04

Intru


People also ask

How do I restore the Back button in Chrome?

Google ChromeOpen the Chrome menu and select Settings. Then, select Advanced > Reset and clean up > Restore settings to their original defaults.

Why is the back button missing in Chrome?

You may have the frustrating gesture-based navigation turned on (by default) and not did not know you have another option. Go to settings, search g, select gestures, then system navigation, and then 3-button.

Can you disable Back button in Chrome?

To disable the browser "Back" button for a specific page: Open the "UI" tab of the page description window ( "Description" option in the page popup menu). In the "Options" area, for the option "Browser "Back" button", select "Forbidden".


2 Answers

To answer my own question, it seems to be a Chromium bug. I've filed a bug that is currently confirmed and triaged: http://code.google.com/p/chromium/issues/detail?id=125509
So hopefully this should be fixed in the future :)

like image 196
Intru Avatar answered Oct 14 '22 02:10

Intru


Because every browser that navigates outside the document (# is still inside) when navigates back they load the server cached version, and that said Chrome modifies the DOM when you select an option taking away the selected attribute to the selected option element and when you get back it loads again with the selected

like image 34
David Diez Avatar answered Oct 14 '22 02:10

David Diez