<div class="field">
<label class="label">
Priorirty
</label>
<select style="width:100%" asp-for="Priority" class="form-select">
@if (Model.Priority == "Green")
{
<option></option>
<option selected="selected" style="color: green" value="Green">Green</option>
<option style="color: orange" value="Amber">Amber</option>
<option style="color: red" value="Red">Red</option>
}
@if (Model.Priority == "Amber")
{
<option></option>
<option style="color: green" value="Green">Green</option>
<option selected="selected" style="color: orange" value="Amber">Amber</option>
<option style="color: red" value="Red">Red</option>
}
@if (Model.Priority == "Red")
{
<option></option>
<option color: green" value="Green">Green</option>
<option style="color: orange" value="Amber">Amber</option>
<option selected="selected" style="color: red" value="Red">Red</option>
}
@if (Model.Priority == null)
{
<option></option>
<option style="color: green;" value="Green">Green</option>
<option style="color: orange;" value="Amber">Amber</option>
<option style="color: red" value="Red">Red</option>
}
</select>
</div>
For something like this. Is there a simpler way to do this? I’m quite new to razor syntax
Havent tried anything
>Solution :
If you pass an expression to an HTML attribute that evaluates to false
or null
, the attribute is not rendered at all.
<select style="width:100%" asp-for="Priority" class="form-select">
<option></option>
<option selected="@(Model.Priority == "Green")" style="color: green" value="Green">Green</option>
<option selected="@(Model.Priority == "Amber")" style="color: orange" value="Amber">Amber</option>
<option selected="@(Model.Priority == "Red")" style="color: red" value="Red">Red</option>
</select>
But actually, you shouldn’t need to set the selected
attribute value at all. By assigning a value to Model.Priority
, the select tag helper will do it for you because you set the asp-for
attribute to that property.