Be part of JetBrains PHPverse 2026 on June 9 – a free online event bringing PHP devs worldwide together.
<select class="form-control" v-bind:class="{ 'is-invalid' : errors.category_id }" v-model="product.category_id">
<option v-for="category in categories" :selected="category.id ? true : false" :value="category.id">{{ category.name }}</option>
</select>
I've tried :selected="product.category_id == category.id ? true : false " and have done alot of searching but can't find anything to answer what I thought would be a simple problem
You are missing the value on the option ie :value="category.id" + you are comparing the ID to nothing, so what you are essentially doing is selecting all, in which case the first one will be selected, so you need:
:selected="category.id === categoryId"
Having categoryId in your data object, and pre-selected.
Ready more here: https://stackoverflow.com/a/43839491/1457270
@nakov the value on the option is there
May I ask why you want to do such thing? Because it doesn't seem like a Vue'ish way to manipulate things.
Hi @nickcourage
You don’t need to set the selected attribute on the <option> element. It will just auto-select the Id corresponding to the v-model prop that you’ve set at the <select> element.
You can check a working example here: https://codepen.io/mmoreyra/pen/KKzPwZV
Hope it helps!
That's why I asked what I asked. But I think what he wants the "selected" attribute to output in the actual DOM, which is not the v-model behavior.
Hi, i am sorry if it's too late, because i just had this problem too and right now i found the solution myself, so i just gonna put this comment to remind myself in the future, because i can't find any solution in the internet. i am using VUE 3 btw. you just need to put v-bind:value="" in the select component :
<select class="form-control" v-bind:class="{ 'is-invalid' : errors.category_id }" v-model="product.category_id" v-bind:value="product.category_id">
<option v-for="category in categories" :value="category.id">
{{ category.name }}
</option>
</select>
Please or to participate in this conversation.