代码之家  ›  专栏  ›  技术社区  ›  Bruce Phillips

模型状态无效后,选择框未在视图中填充

  •  0
  • Bruce Phillips  · 技术社区  · 6 年前

    我正在创建一个新的。net核心MVC项目,供人们在会议上提交提案以供演示。

    对于提案提交表单,我使用绑定模型(又名视图模型)将用户的输入绑定到表单上。

    以下是绑定模型类的部分代码:

    public class BaseSubmissionBindingModel
    {
    
        public BaseSubmissionBindingModel(){
    
        }
    
        [Required]
        public int ConferenceId { get; set; }
    
        [Required]
        [StringLength(250)]
        [Display(Name = "Title")]
        public string SubmissionTitle { get; set; }
    
        [Required]
        [StringLength(1000)]
        [Display(Name = "Abstract")]
        public string SubmissionAbstract { get; set; }
    
    
        public IEnumerable<SelectListItem> SubmissionCategoryItems { get; set; }
    
        [Required]
        [Display(Name = "Select the Submission Category ")]
        public string SelectedSubmissionCategory { get; set; }
    
    }
    

    请注意字段SubmissionCategoryItems-此字段用于在视图中填充下拉选择表单控件。此控件的数据来自数据库查询,要显示哪些提交类别取决于会议id值。

    在controller类中,我获取会议id的提交类别,并创建 List<SelectListItem> submissionCategoryItems 每个提交类别都有一个SelectListItem对象。

    然后,我创建BaseSubmissionBindingModel对象,并将submissionCategoryItems分配给 BaseSubmissionBindingModel IEnumerable<SelectListItem> SubmissionCategoryItems

    然后,控制器返回视图(baseSubmissionBindingModel)。

    用户输入的视图页面正确呈现,并且“选择提交类别”选择框具有每个提交类别的正确选项。

    下面是创建提交表单上的HTML

    <div class="form-group">
        <label asp-for="SelectedSubmissionCategory"></label>
        <select asp-for="SelectedSubmissionCategory" asp-items="@Model.SubmissionCategoryItems">
             <option value="" selected>--select--</option>
        </select>
        <span asp-validation-for="SelectedSubmissionCategory"></span>
    </div>
    

    如果用户没有在表单上输入所需的值,但单击表单的提交按钮,则会出现我的问题。

    我的控制器类具有下面的CreateSubmission方法,当用户单击表单上的submit时,将调用该方法

    public IActionResult CreateSubmission(BaseSubmissionBindingModel baseSubmissionBindingModel) {
    
            if (! ModelState.IsValid) {
    
                return View("Index", baseSubmissionBindingModel);
            }
    
            Log.Information("Submission data provided is " + baseSubmissionBindingModel.ToString());
    
            return View("Success", baseSubmissionBindingModel);
    
        }
    

    如果用户提交表单时未提供所有必需的数据,则模型的状态无效。初始视图将与验证错误消息一起返回给用户。

    但是,提交类别的选择框不再具有从数据库检索的提交类别的任何选项。因此,用户无法再选择提交类别。

    如果用户最初未能提供所有必需的数据,但仍然提交表单,我如何确保提交类别选择框仍有其选项元素?

    谢谢你的帮助。

    布鲁斯

    1 回复  |  直到 6 年前
        1
  •  5
  •   Shyju    6 年前

    当模型状态验证失败时,您将返回到相同的视图,该视图具有选择标记辅助对象。选择标记辅助对象正在使用 SubmissionCategoryItems 属性作为源集合传递的视图模型,以生成SELECT元素的选项。 Http是无状态的 。对于您的第二个调用(表单提交调用),它不知道您在上一个调用中做了什么(您在GET操作调用中设置了这些集合项)。因此,每次返回到使用该集合构建select元素的视图时,都需要设置集合属性值。

    public IActionResult CreateSubmission(BaseSubmissionBindingModel model) 
    {
        if (! ModelState.IsValid)
        {
            // Set the collection property value again
            model.SubmissionCategoryItems = GetCategoryItems(); 
            return View("Index", model);
        }
        //to do : do some thing useful
        Log.Information("Submission data " + baseSubmissionBindingModel.ToString());
        return View("Success", model);    
    }
    
    private List<SelectListItem> GetCategoryItems()
    {
        var items = new List<SelectListItem>();
    
        // TO DO : I hard coded 2 items. You can replace it with items from your database
    
        items.Add(new SelectListItem() { Value = "1", Text = "Seattle" });
        items.Add(new SelectListItem() { Value = "2", Text = "Detroit" });
    
        return items;
    }