locked
Add Flag into Language select dropdown without need for third party add on RRS feed

  • Question

  • User-183185495 posted

    I am wanting just to use flag icon css to show the flag next to the culture it works outside the select fine but I want it inside the select dropdown like many sites do.

    If you notice the span out side the selector.

    @using Microsoft.AspNetCore.Builder
    @using Microsoft.AspNetCore.Localization
    @using Microsoft.AspNetCore.Mvc.Localization
    @using Microsoft.Extensions.Options
    
    @inject IViewLocalizer Localizer
    @inject IOptions<RequestLocalizationOptions> LocOptions
    
    @{
        var requestCulture = Context.Features.Get<IRequestCultureFeature>();
        var cultureItems = LocOptions.Value.SupportedUICultures
            .Select(c => new SelectListItem { Value = c.Name, Text = c.DisplayName })
            .ToList();
        var returnUrl = string.IsNullOrEmpty(Context.Request.Path) ? "~/" : $"~{Context.Request.Path.Value}";
    }
    
    <div title="@Localizer["Request culture provider:"] @requestCulture?.Provider?.GetType().Name">
        <form id="selectLanguage" asp-controller="MISObjects" asp-action="SetLanguage" asp-route-returnUrl="@returnUrl"
              method="post" role="form">
            <span class="flag-icon flag-icon-@requestCulture.RequestCulture.Culture"></span>
            <label  asp-for="@requestCulture.RequestCulture.UICulture.Name">@Localizer["Language:"]</label>
            
            <select name="culture"
                                                                                                                   onchange="this.form.submit();"
                    
                                                                                                                   asp-for="@requestCulture.RequestCulture.UICulture.Name" asp-items="cultureItems">
    
            </select>
        </form>
    </div>

    Saturday, July 18, 2020 1:29 AM

All replies