如何将包含字典的类列表绑定到asp.net核心中的视图？答案

【问题标题】：How to bind a list of a class that includs a dictionary to the view in asp.net core?如何将包含字典的类列表绑定到asp.net核心中的视图？
【发布时间】：2021-02-04 15:44:47
【问题描述】：

我有一个包含一个字典的类。 int 是单选按钮的键，值是选择标题。我正在尝试获取控制器中的字典列表，包括单选按钮的键和值。当我运行程序时，列表为 0。我认为单选按钮的名称和选择标题的输入有问题，但我不知道应该写什么。

public class ChoiceQuestion
{
    public int QuestionId { get; set; }
    public Dictionary<int, string> Choice { get; set; }
    public int Answer { get; set; }    
}

在控制器中我有这个：

 public IActionResult CreateQuestion(int courseId, List<ChoiceQuestion> choices,
        QuestionType type, Question question)
    {
        _questionService.AddQuestion(courseId, type, choices, question);

        return RedirectToAction("Index");
    }

这是我的观点：

 <div class="form-group choiceDiv" style="display: none;" id="choiceDiv">
            <a id="plus"><i class="glyphicon glyphicon-plus"></i></a>
            <input type="radio" name="choices.choice[0].key" value="1" />
            <input type="text" placeholder="گزینه " name="choices.choice[0].value" />

            <input type="radio" name="choices.choice[1].key" value="1" />
            <input type="text" placeholder="گزینه " name="choices.choice[1].value" />

            <span asp-validation-for="Choice" class="text-danger"></span>
        </div>

【问题讨论】：

标签： html asp.net-core

【解决方案1】：

首先您要将数据传递给List<ChoiceQuestion> choices，因此您的输入名称需要为choices[xxx].choice[xxx]。

然后，您可以在提交表单之前更改您的文本类型输入名称，以便文本类型输入的值将绑定到List<ChoiceQuestion> choices 的字典。这是一个工作演示：

<form method="post" id="myform">
    <div class="form-group choiceDiv" style="display: none;" id="choiceDiv">
        <a id="plus"><i class="glyphicon glyphicon-plus"></i></a>
        <input type="radio" name="choices[0].choice[0].key" value="1" />
        <input type="text" placeholder="گزینه " name="choices[0].choice[key]" value="choicetitle1" />

        <input type="radio" name="choices[0].choice[1].key" value="2" />
        <input type="text" placeholder="گزینه " name="choices[0].choice[key]" value="choicetitle2" />

        <span asp-validation-for="Choice" class="text-danger"></span>
    </div>
    <input type="submit" value="submit" />
</form>
<script>
    $('#myform').submit(function () {
        var keys = [];
        var count = 0;
        $("#choiceDiv input[type='radio']").each(function () {
            keys.push($(this).val());
        });
        $("#choiceDiv input[type='text']").each(function () {
            $(this).attr("name", $(this).attr("name").replace("key", keys[count]));
            count++;
        });
    });
</script>

我将文本类型输入名称更改为choices[0].choice[key]，在提交表单之前，我将名称中的'key'替换为单选按钮的值。然后表单将发布字典数据。

结果：

或者您可以删除单选按钮，并使用如下视图：

<div class="form-group choiceDiv" style="display: none;" id="choiceDiv">
            <a id="plus"><i class="glyphicon glyphicon-plus"></i></a>
            <input type="text" placeholder="گزینه " name="choices[0].choice[1]" value="choicetitle1"/>

            <input type="text" placeholder="گزینه " name="choices[0].choice[2]" value="choicetitle2"/>

            <span asp-validation-for="Choice" class="text-danger"></span>
        </div>

然后你会在字典中得到 key=1,value="choicetitle1";key=2,value="choicetitle2"。

【讨论】：