[SOLVED] how to show Html tags in asp.net core select list Item

Issue

in the view of the select list, it shows HTML tags as text

 foreach (var productColorDto in colorList)
        {
           
            colorSelectList.Add(new SelectListItem
            {
                Value = productColorDto.Id.ToString(),
                Text = productColorDto.Name + " - " +
                       $"<span class='item fa fa-circle' style='color: {productColorDto.HexValue}'></span>",
                Selected = config.Color.Id == productColorDto.Id
            });
        }

and this is the view

<select class="js-example-basic-single col-lg-6 mb-2" asp-for="Color.Id" asp-items="selectListColor" multiple></select>

Solution

If you want to set options with colorList:

@foreach (var productColorDto in colorList)
{
    if (config.Color.Id == productColorDto.Id)
    {
        <option [email protected]() selected>@productColorDto.Name-<span class='item fa fa-circle' style='color: @productColorDto.HexValue'></span></option>
    }
    else
    {
        <option [email protected]()>@productColorDto.Name-<span class='item fa fa-circle' style='color: @productColorDto.HexValue'></span></option>
    }

}

Answered By – Yiyi You

Answer Checked By – David Goodson (BugsFixing Volunteer)

Leave a Reply

Your email address will not be published. Required fields are marked *