When using HTML <select> tag, changed 'selected' value not displayed in Firefox
Asked Answered
P

4

5

Hello (this is a copy of my post on the Seaside mailing list; first try at stackoverflow), How do I get the rendered display of a drop-down select list to show an updated selection from another session, in Firefox? (I'm using 3.6.13)

This problem does not appear in Chrome, IE or Opera.

Here is the scenario: I have a domain object with an attribute displayed in a drop-down list. Some other session updates the attribute. I refresh my display, but the rendered selection does not change. Using Firebug, the generated html shows the updated selection. This may be basic HTML knowledge, but should the displayed value not update to show the changed 'selected' option? Or is the value intended to be set only on the initial page display and then only by a user action?

Example: I have a demo Seaside component with a class variable #testStateListSelection which is selected to 'one' in a Seaside session. If I change the value to 'three' in another Seaside session, the displayed value stays as 'one' in the original session after rendering again, even though the "selected" in the generated HTML shows "three".


renderSelectionListOn: html
    html form: [
        html select 
            list: #('one' 'two' 'three' 'four' 'five'); 
            selected: self class testStateListSelection; 
            callback: [:value | self class testStateListSelection: value].
        html break.
        html submitButton
            callback: [Transcript cr; show: self class testStateListSelection];
            with: 'Save']

...the displayed value shows 'one', even though the HTML is...

<select name="1">
<option value="1">one</option>
<option value="2">two</option>
<option value="3" selected="selected">three</option>
<option value="4">four</option>
<option value="5">five</option>
</select>

How do I get the drop-down selected value to show 'three'?

BTW: all I know about HTML & browser behaviour I've learned from coding Seaside, so I may have a skewed perspective ;-)

Thanks for any help.

Philoctetes answered 1/2, 2011 at 12:33 Comment(2)
When you say "after rendering again" - has the browser navigated to another page, or have you just refreshed (F5 or equivalent) the page?Lammers
Just a refresh ... F5 or the "Reload current page" buttonPhiloctetes
L
8

The problem is that, when you refresh your page, your browser is remembering which option was previously selected. This feature is designed to make it harder to lose your form data during long forms and is discussed a bit on the Mozillazine forums

Instead of refreshing the page. if you load the page "fresh" by going to the address bar and pressing return, you'll get the page loaded from the server again - with the updated select

Lammers answered 1/2, 2011 at 13:18 Comment(2)
This was driving me crazy. Thanks for this answer.Fifteen
I would be curious to know what could be done to force the browser to update the display based on the selected value without asking the user to explicitely reload stuff from the address bar.Cavan
T
2

Another cause of the problem might be that your browser tries to autocomplete the form for you based on your last submission. Make sure you have disabled this feature in the preferences of your web browser. You can also try to tell the form-tag with an unofficial attribute not to autocomplete:

html form noAutocomplete; with: [ ...
Teetotalism answered 1/2, 2011 at 20:42 Comment(1)
Excellent. That works. The generated HTML add autocomplete="off" to the form and the updated value shows correctly when the browser is refreshed. Thanks.Philoctetes
T
1

Whenever the page is refreshed the accessor self class testStateListSelection is run.

In fact the code you provide works perfectly for me. Are you sure that the accessors work as expected?

testStateListSelection
   ^ testStateListSelection    " <-- forgetting the return is a common problem "

testStateListSelection: aString
   testStateListSelection := aString
Teetotalism answered 1/2, 2011 at 20:37 Comment(1)
Yes, the accessors are correct. I echo the selected option in the Transcript and the generated HTML reflects the selection. The problem only appears in Firefox and only if the #testStateListSelection value is changed by another session.Philoctetes
I
1

If using javascript to refresh the page...

window.location.reload();

...will NOT re-render the select elements. They will retain their dynamic values regardless of what the new source HTML says.

To force the select elements to re-render, use...

window.location.reload(true);
Insentient answered 16/11, 2011 at 0:15 Comment(0)

© 2022 - 2024 — McMap. All rights reserved.