如何通过在 Razor 页面中输入的字母过滤 @Html.DropDownListFor？

Question

This is the function in my Controller.cs

    public IActionResult Create()
    {
        //Create Nation List
        var region = CultureInfo.GetCultures(CultureTypes.SpecificCultures)
                        .Select(x => new RegionInfo(x.LCID));
        Regex regex = new Regex(@"^[A-Z]+$");
        List<Tuple<string, string>> countryList = (from x in region
                                                   select new Tuple<string, string>(x.ThreeLetterISORegionName, x.DisplayName))
                                    .Distinct()
                                    .OrderBy(x => x.Item2)
                                    .Where(x => regex.IsMatch(x.Item1))
                                    .ToList<Tuple<string, string>>();

        List<string> xxxCountryList = countryList
            .Select(x => new string(x.Item2 + " (" + x.Item1 + ")")).ToList();
        ViewBag.CountryTupleList = xxxCountryList;
        return View();
    }

And this is the code in my view.

        <div class="form-group col-lg-8 col-md-8 col-xs-12">
                    <div class="ml-1">
                        @{                                
                            @Html.DropDownListFor(m => m.Nationality, new SelectList(ViewBag.CountryTupleList), "- Please Select -", new { @class = "form-control" })
                        }
                    </div>
                </div>

Currently the countries are being displayed in the dropdown list. It's a bit tedious to scroll all the way down. Can anyone suggest me on how can i filter the counter? ie enter letter "G" and only countries starting with letter G will be displayed! Huge Thanks in advance!

Answer 1

I believe you are looking for Chosen as your solution

https://julesjanssen.github.io/chosen/

It supports single and multi select :-)

Kind regards