ASP.NET Core MVC - 無效的操作異常沒有 Ienumerable 類型的視圖數據<SelectListItem>

Question

我正在嘗試根據在國家/地區下拉列表中選擇的國家/地區名稱級聯國家名稱。 我已經為所選國家/地區的 post 方法編寫了 JS。 但是當我在視圖中添加狀態下拉列表並對其進行調試時。 我收到錯誤 - 沒有鍵 StateName1 的 Ienumerable 類型的 Viewdata。

新請求視圖模型

public class NewRequestView 
{    
    public string SelectedCountry { get; set; }
    public IEnumerable<SelectListItem> Countries { get; set; }
    public IEnumerable<SelectListItem> State { get; set; }        
}

國家模式

public class Country
{
    public int CountryID { get; set; }
    public string CountryName { get; set; }
}

控制器

 public IActionResult NewRequest()
    {
        var model = new NewRequestView { };                      
        model.Countries = iMapper.Map<IEnumerable<Country>, IEnumerable<SelectListItem>>(GetCountries());            
        return View(model);
    }

看法

                             <div class="row">
                                <div class="col-xs-10 multiSelectCheckboxDiv" id="multiSelectCheckboxDiv">
                                    <span class="col1 contrlLabel" style=" font-family:calibri;color:gray;font-size:15px">Clients<span style="font-weight:800;color:red;">*</span>:</span>
                                    @Html.DropDownList("CountryName", Model.Countries ,"Select Country",new { @class = "form-control"})
                                    <div class="input-validation-errorText col-md-6" style="display:none;">
                                        Please select Country.
                                    </div>
                                </div>
                            </div>
                            <div class="row">
                                <div class="col-xs-10 multiSelectCheckboxDiv" id="multiSelectCheckboxDiv">
                                    <span class="col1 contrlLabel" style=" font-family:calibri;color:gray;font-size:15px">Clients<span style="font-weight:800;color:red;">*</span>:</span>
                                    @Html.DropDownList("StateName1", Model.State, "Select State", new { @class = "form-control" })
                                    <div class="input-validation-errorText col-md-6" style="display:none;">
                                        Please select state.
                                    </div>
                                </div>
                            </div>

我使用 AutoMapper 來映射國家/地區名稱。

映射器

 var config = new MapperConfiguration(cfg =>
        {
            cfg.CreateMap<Client, SelectListItem>()
             .ForMember(x => x.Text, opt => opt.MapFrom(o => o.CountryName))
             .ForMember(x => x.Value, opt => opt.MapFrom(o => o.CountryName));

        });
        return config.CreateMapper();

從選定的國家/地區我正在解雇 JS 以獲取所有州名。 但在我選擇自己之前，我收到了錯誤

InvalidOperationException: 沒有具有鍵“StateName1”的“IEnumerable”類型的 ViewData 項。

讓我知道我在這里做的錯誤是什么

Answer 1

無效的操作異常沒有 Ienumerable 類型的視圖數據

這是由在您的視圖中提供給Html.DropdownList()的空列表引起的。

查看您的控制器操作，您沒有任何可以提供model.State值的東西。

public IActionResult NewRequest()
{
   var model = new NewRequestView { };                      
   model.Countries = iMapper.Map<IEnumerable<Country>, IEnumerable<SelectListItem>>(GetCountries());

   // you need something like this
   model.State = new List<SelectListItem>(){
      new SelectListItem(){ Text = "Test", Value = "Test" }
   };

   return View(model);
}

---

另一種選擇是，由於一旦選擇了國家，狀態記錄將來自 ajax 事件，您實際上可以將 model.State 留空並且不要使用Html.Dropdown() 。

你可以這樣做; 當您提交表單時，手動創建的選擇字段仍將被識別為模型的一部分。

<div class="row">
   <div class="col-xs-10 multiSelectCheckboxDiv" id="multiSelectCheckboxDiv">
      <span class="col1 contrlLabel" style=" font-family:calibri;color:gray;font-size:15px">Clients<span style="font-weight:800;color:red;">*</span>:</span>

      <select id="StateName1" name="Model.State" class="form-control">
         <option>Select State</option>
      </select>
      <div class="input-validation-errorText col-md-6" style="display:none;">
         Please select state.
      </div>

   </div>
</div>

Answer 2

您需要通過將國家 ID 傳遞給您的方法並以 JSON 形式返回 StateList 來進行 AJAX 調用以獲取狀態。

檢查級聯下拉示例以獲取分步演練。