在编辑模式MVC中未正确选择标志

如何解决在编辑模式MVC中未正确选择标志

我正在使用select 2来给自己一个在另一个国家/地区中找到的国家/地区列表，但是我需要某种方式能够选择我在编辑模式下使用的标志。这样就建立了下拉列表，该问题的完整性是国家的缩写。我正在使用asp.net core 3.1.7和ef core 3.1。

然后在我的编辑页面中，我有以下内容。

<div class="form-group">
    @Html.LabelFor(m => m.CountryOfBirth)
    <span asp-validation-for="CountryOfBirth" class="text-danger"></span>
    <select asp-for="CountryOfBirth" class="form-control select2" style="height:35px" name="Flag">
        <option>Please select Country Of Birth</option>
    </select>
    <span asp-validation-for="CountryOfBirth" class="text-danger"></span>
</div>

正如您马上看到的那样，问题是我在iso country变量中存储了一个Country字符串而不是一个ID，但是这不起作用，因为我需要一个ID才能绑定到上面的Select。

但是我需要国家/地区字符串，以便能够从这里https://github.com/lipis/flag-icon-css

来使用我正在使用的flags.css文件中的标志。

<script>
 $(function () {
    //Initialize Select2 Elements
    $('.select2').select2()
    var isoCountries = [
        { id: 'Uk',text: 'United Kingdom' },{ id: 'US',text: 'United States' }
 ];

function formatCountry(country) {
        if (!country.id) { return country.text; }
        var $country = $(
            '<span class="flag-icon flag-icon-' + country.id.toLowerCase() + ' flag-icon-squared"></span>' +
            '<span class="flag-text">' + country.text + "</span>"
        );
        return $country;
    };

    //Assuming you have a select element with name country
    // e.g. <select name="name"></select>
    $("[name='Flag']").select2({
        placeholder: "Please Select a country",templateResult: formatCountry,data: isoCountries
    });
});
</script>