Assaf Karmon
Assaf Karmon

Reputation: 923

Browser caching select tag state and ignoring selected="true"

I'm rendering a drop down box that contains a currently selected value using selected="true".

<select id="dropDown"> 
    <option selected="true" value="1">value2</option>
    <option value="2">value3</option>
    <option value="3">value4</option>
</select>

Initially the selected value corresponds to the selected="true", but if I play around with the drop down box and then refresh the page the selected="true" is ignored and the displayed value is the last one I chose. I tried using selected="selected" with the same results. Thanks for your help.

Upvotes: 9

Views: 8661

Answers (3)

GeorgeButter
GeorgeButter

Reputation: 2591

For best browser support it's actually (although it seems so dumb) better to use

autocomplete="nope"

To quote MDN:

In some cases, the browser will keep suggesting autocompletion values even if the autocomplete attribute is set to off. This unexpected behavior can be quite puzzling for developers. The trick to really forcing the no-autocompletion is to assign a random string to the attribute [...] Since this random value is not a valid one, the browser will give up.

Upvotes: 0

j08691
j08691

Reputation: 207901

Change your select field to <select id="dropDown" autocomplete="off">

Upvotes: 18

Diodeus - James MacFarlane
Diodeus - James MacFarlane

Reputation: 114367

It's a binary value, not an attribute (for some reason). Use:

<option selected="selected" value="1">value2</option>

or:

<option selected value="1">value2</option>

Upvotes: -1

Related Questions