6

I have an html file that contains the following code :

<select id="gouv" name="gouv">
...some options here...
</select>

and the following jQuery code :

$('#gouv option[value="myvalue"]').attr("checked","checked");

this as you certainly know sets the option with the value "myvalue" to checked which works perfectly.

Now the problem is, I don't know the value of the option I want to set as checked because this value is a result of some function which is stored within a global variable. For simplification sake, after long debugging, I reduced the problem to the following :

var ident="myvalue";
$('#gouv option[value=ident]').attr("checked","checked");

and this code doesn't work !

I would like to know why it doesn't work, can't we pass a value as a variable ? And is there any workaround to this ?

aynber
  • 22,380
  • 8
  • 50
  • 63
Ilyes Ferchiou
  • 583
  • 3
  • 10
  • 22
  • 1
    Did you try `$('#gouv').val(ident)` ? jQuery's `.val()` should be able to set the value of a select. – Mark Eirich Jun 30 '12 at 19:47
  • @MarkEirich. How is `val` related? – gdoron Jun 30 '12 at 19:49
  • `.val(value)` sets the value of a select. Isn't that what you wanted? – Mark Eirich Jun 30 '12 at 19:50
  • 1
    @MarkEirich. Read my answer, no. `:)` – gdoron Jun 30 '12 at 19:50
  • Um... `$('#gouv').val(ident)` should do the exact same thing as `$('#gouv option[value="' + ident + '"]').attr("selected", "selected");` Did you try it? – Mark Eirich Jun 30 '12 at 19:52
  • Well there's one difference ``$('#gouv').val(ident)`` would work only for selecting 1 options, while with using ``$('#gouv option[value="' + ident + '"]').attr("selected", "selected");`` You can also choose more option. So is not exactly the same. – Lyokoheros Jun 17 '21 at 15:00

3 Answers3

21
var ident="myvalue";
$('#gouv option[value="' + ident + '"]').attr("selected", "selected");

selected is for <option>, checked is for radio!

And better use prop if your jQuery version is > 1.6

$('#gouv option[value="' + ident +'"]').prop("selected", true);

Note that you better use filter instead of attribute selector:

$('#gouv option').filter(function(){
    return this.value == indent;
}).prop("selected", true);

Why you should use filter for value

If you need to support blackberry, they have bug with option.value that jQuery handle:

$('#gouv option').filter(function(){
    return $(this).val() == indent;
}).prop("selected", true);
Community
  • 1
  • 1
gdoron
  • 147,333
  • 58
  • 291
  • 367
  • Thank you a lot, now I feel like an idiot, I used this before and completely forgot about it. Thank you for the checked/selected remark, it was just an error while writing this post. My jQuery version is quite old so prop isn't supported. Can you please tell me why is it better to use filter ? Thanks a lot again. – Ilyes Ferchiou Jun 30 '12 at 19:51
  • @IlyesFerchiou. There is a link to other question where I answered it, there is no need to duplicate it again. Did you read it? – gdoron Jun 30 '12 at 19:52
  • No, I didn't, I will try to look for it. Thanks again. I will set the answer as accepted as soon as the website allows me. – Ilyes Ferchiou Jun 30 '12 at 19:55
  • @Ilyes Use `.val()` instead, as Mark suggests in his answer. Gdoron's way works, however it's taking the long way round when `.val()` works in exactly the same manner. – Bojangles Jun 30 '12 at 19:57
  • @JamWaffles. Yep his answer is better. (Though mine should be a little bit faster- so I believe) – gdoron Jun 30 '12 at 19:58
  • This trick with the double quoted variable saved my life! Thanks!! – Garavani Mar 22 '16 at 08:38
5

jQuery's .val() (see here) will select an option by value:

var ident = "myvalue";
$('#gouv').val(ident);

This is equivalent to:

var ident = "myvalue";
$('#gouv option[value="' + ident + '"]').attr("selected", "selected");

Except that the latter will have issues if ident contains any double quotes.

Mark Eirich
  • 10,016
  • 2
  • 25
  • 27
  • Well, this does work too, even though I don't understand how, I thought value in this case would return all SELECT elements with a value of ident and not all OPTION elements ! But the thing is, even though longer, the first option has no problem with double quotes, if the string had double quotes I wouldn't be able to set it as a variable at first, I would have had to escape the quotes while setting the variable and there would be no problem next. – Ilyes Ferchiou Jun 30 '12 at 20:06
  • 1
    So thank you a lot for your answer, it is surely simpler, but my question was first about why I can't use a variable they way I meant to use it and gdoron answered perfectly, I wish I could set 2 chosen answers but I can't, so I'll give you a +1 and thanks a lot again for taking the time to give me this simpler solution. – Ilyes Ferchiou Jun 30 '12 at 20:07
  • Thank you, I did, this is how it is supposed to work, but I had a misunderstanding of this function apparently. Thank you again ! – Ilyes Ferchiou Jun 30 '12 at 20:10
0

I tried all the above answers, (They are correct no doubt) but they didn't work for me don't know the reasons, somehow I figured out the following one-line code works so easily, My dropdown value wasn't changing for the front view even though it changes when I click on dropdown select.. so for me the solution is

$('#nights').show().focus().click();
Hassan Qasim
  • 463
  • 5
  • 5