Question

我有一个输出问题列表的视图。用户将选择他们想要包含在报告中的问题，然后提交表格。

我的观点如下：

@using (Html.BeginForm("Step6", "Home", FormMethod.Post))
{
  @Html.HiddenFor(m => m.EventID)
  @Html.HiddenFor(m => m.CompanyID)
  foreach (var item in Model.Questions)
  {
      <div class="checkbox">
      <input type="checkbox" id="@item.QuestionID" name="QuestionIds" value="@item.Title" />
      <label for="@item.QuestionID">@item.Title</label>
      </div>
  }
  <p><input type="submit" class="btn btn-primary" value="Submit" /></p>
}

生成的HTML看起来像：

<div class="checkbox">
    <input type="checkbox" id="12" name="QuestionIds" value="Would you like an account manager to contact you?" />
    <label for="12">Would you like an account manager to contact you?</label>
</div>
<div class="checkbox">
    <input type="checkbox" id="13" name="QuestionIds" value="Comments - please be as detailed as possible." />
    <label for="13">Comments - please be as detailed as possible.</label>
</div>

问题集：

public class Question
{
    public Guid QuestionID { get; set; }
    public string Title { get; set; }
}

控制器操作

    [HttpPost]
    public ActionResult Step6(Models.EventCompanyQuestionnaireQuestions model)
    {
        return View();
    }

模特：

public class EventCompanyQuestionnaireQuestions
{
    public int EventID { get; set; }
    public int CompanyID { get; set; }
    public List<Guid> QuestionIds { get; set; }
}

提交表单时，List是一个空的初始化列表。渲染的表单元素名为QuestionIds，与模型匹配。我需要QuestionIds才能选中复选框。

Answer 1

这是我的模特：

 public class Question
{
    public int QuestionID { get; set; }
    public string Title { get; set; }
    public bool Selected { get; set; }
}

public class EventCompanyQuestionnaireQuestions
{
    public int EventID { get; set; }
    public int CompanyID { get; set; }
    public List<Question> Questions { get; set; }
}

以下是观点：

@using (Html.BeginForm("Edit", "Question", FormMethod.Post))
{
    @Html.HiddenFor(m => m.EventID)
    @Html.HiddenFor(m => m.CompanyID)
    for (int i = 0; i < this.Model.Questions.Count; i++)
    {
    <div class="checkbox">
        @Html.HiddenFor(m => m.Questions[i].QuestionID)
        @Html.CheckBoxFor(m => m.Questions[i].Selected)
        @Html.DisplayFor(m => m.Questions[i].Title)
    </div>
    }
    <p><input type="submit" class="btn btn-primary" value="Submit" /></p>
}

用于测试的控制器：

 // GET: Question
    public ActionResult Index()
    {
        EventCompanyQuestionnaireQuestions model = new EventCompanyQuestionnaireQuestions
        {
            CompanyID = 1,
            EventID = 2,
            Questions = new List<Question>
            {
                new Question {    QuestionID = 1,   Selected = false,  Title= "What is your name"  },
                new Question {    QuestionID = 2,   Selected = false,  Title= "How old are you"  },
                new Question {    QuestionID = 3,   Selected = false,  Title= "Where are you from"  },
                new Question {    QuestionID = 4,   Selected = false,  Title= "What is your profession"  },
            }
        };
        return View(model);
    }


    [HttpPost]
    public ActionResult Edit(EventCompanyQuestionnaireQuestions model)
    {
        var ids = model.Questions.Where(q => q.Selected).Select(q => q.QuestionID).ToList();

        if(ids!=null && ids.Any())
        {
            foreach (var id in ids)
                Debug.WriteLine(id);
        }

        return View();
    }

以下是Visual Studio的结果： post

Answer 2

您需要使用索引表达式：

@using (Html.BeginForm("Step6", "Home", FormMethod.Post))
{
    @Html.HiddenFor(m => m.EventID)
    @Html.HiddenFor(m => m.CompanyID)
    for( Int32 i = 0; i < this.Model.Questions.Count; i++ )
    {
    <div class="checkbox">
        @Html.CheckBoxFor( m => m.Questions[i].Selected )
        @Html.LabelFor( m => m.Questions[i].Selected, this.Model.Questions[i].Title )
    </div>
    }
    <p><input type="submit" class="btn btn-primary" value="Submit" /></p>
}

请注意，理想情况下，<label>应包含<input>和文本。我还将<input type="Submit" />更改为<button>：

@using (Html.BeginForm("Step6", "Home", FormMethod.Post))
{
    @Html.HiddenFor(m => m.EventID)
    @Html.HiddenFor(m => m.CompanyID)
    for( Int32 i = 0; i < this.Model.Questions.Count; i++ )      {
    <div class="checkbox">
        <label for="@Html.IdFor( m => m.Questions[i].Selected )">
            @Html.CheckBoxFor( m => m.Questions[i].Selected )
            @this.Model.Questions[i].Title
        </label>
        @Html.HiddenFor( m => m.Questions[i].QuestionId );
    </div>
  }
  <p><button type="submit" class="btn btn-primary">Submit</button></p>
}

如何将MVC复选框绑定到模型

2 个答案: