ASP.NET 核心 MVC - 无效操作异常没有 Ienumerable 类型的视图数据<SelectListItem>

ASP.NET Core MVC - Invalid Operation Exception There is no viewdata of type Ienumerable<SelectListItem>

我正在尝试根据国家/地区下拉列表中 selected 的国家/地区名称来级联国家/地区名称。 我已经为 selected Country 编写了 post 方法的 JS。但是当我在视图中添加状态下拉列表并调试它时。我收到错误 - 没有键 StateName1 的 Ienumerable 类型的视图数据。

新建请求视图模型

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 以获取所有州名称。但是在我 select 本身之前我得到了错误

InvalidOperationException: There is no ViewData item of type 'IEnumerable' that has the key 'StateName1'.

让我知道我在这里做的错误是什么

Invalid Operation Exception There is no viewdata of type 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);
}

另一种选择是,一旦一个国家被 selected,国家记录将来自 ajax 事件,你实际上可以将 model.State 留空而不使用Html.Dropdown().

你可以做到; 当您提交表单时,手动创建的 select 字段仍将被识别为模型的一部分。

<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>

您需要进行 AJAX 调用以通过将国家 ID 传递给您的方法和 return JSON 中的 StateList 来获取州。

检查 Cascaded Dropdown Example 以获得分步演练。