【问题标题】:razor - binding issue with radio buttonrazor - 单选按钮的绑定问题
【发布时间】:2015-03-31 00:14:54
【问题描述】:

我正在努力为单选按钮绑定 ans 我正在做一个小项目。 我有两个模型问题和答案。我想要实现的是拉出问题列表并基于设置用户将有多项选择或在文本框中键入答案。使用单选按钮,我似乎无法绑定它得到一个空对象的ans,有人可以指出我正确的方向。

@model List<Question.Models.Questionnaire>


@{
ViewBag.Title = "Index";
Layout = "~/Views/Shared/_Layout.cshtml";
}

<h2>Question List</h2>

@using(Html.BeginForm("GetAnswer","Home")) {


for(int i = 0;i < Model.Count;i++) {

    <text>@Model[i].Questions</text> <br />

    @Html.HiddenFor(M => M[i].QuestionID)

    if (@Model[i].MultipleChoice == false){

        @Html.TextBoxFor(M => M[i].Response) <br />

    } else {

          for(int j = 0;j < Model[i].GetAns.Count;j++) {
               <div>
              <text>@Model[i].GetAns[j].AnsText</text>
              @Html.RadioButtonFor(M => Model[i].QuestionID, Model[i].GetAns[j].AnswerId) <br />
               </div>
        }

        /*
        foreach(var ansOption in PossibleAns) {
          <div>
           @Html.RadioButtonFor(model => Model[i].QuestionID, ansOption.AnswerId)
           @Html.Label(ansOption.AnsText)
          </div>  
        }
         * */
        <br />
    }
}
<br />

  <input type="submit" name="submit" />

}

public class Questionnaire
{
    public Questionnaire() {
    }

    public int QuestionID  { get; set;}
    public string Title    { get; set;}
    public string Questions{ get; set;}
    public string Response { get; set;}
    public bool MultipleChoice { get; set;}

    public List<Answer> GetAns { set; get;}

}

 public class Answer  
 {
    public int AnswerId { get; set; }
    public string AnsText { get;set;}
    public Questionnaire Ques { get; set;}
 }


public class QuestionRepository
{

    public List<Questionnaire>
         GetQuestionnaire() {
             List<Questionnaire> q = new List<Questionnaire>();
             q.Add(new Questionnaire() {
                 QuestionID = 11, Title = "Geo", Questions = "Capital of England?", GetAns = GetAns(), MultipleChoice = true
             });
             q.Add(new Questionnaire() {
                 QuestionID = 22, Title = "Geo", Questions = "Capital of France", GetAns = GetAns()
             });
             q.Add(new Questionnaire() {
                 QuestionID = 33, Title = "Geo", Questions = "Capital of Cuba", GetAns = GetAns()
             });
             return q;
    }

    public List<Answer> GetAns() {

        List<Answer> ans = new List<Answer>();
        ans.Add(new Answer() {
            AnswerId = 1, AnsText = "london", Ques = new Questionnaire() {
                QuestionID = 11
            }
        });
        ans.Add(new Answer() {
            AnswerId = 2, AnsText = "paris", Ques = new Questionnaire() {
                QuestionID = 22
            }
        });
        ans.Add(new Answer() {
            AnswerId = 3, AnsText = "Havana", Ques = new Questionnaire() {
                QuestionID = 33
            }
        });

        return ans;
    }



}

【问题讨论】:

    标签: c# asp.net asp.net-mvc-3 asp.net-mvc-4 razor


    【解决方案1】:

    您的单选按钮绑定到属性QuestionID(并且您使用选定的AnswerID 覆盖了QuestionID 的值,因此当您回发时没有任何意义。您的类和属性命名使其难以理解,但如果您想从一组可能的答案中选择一个答案,则属性GetAns 只需为List&lt;string&gt;,然后将所选答案绑定到属性Response。例如,对于第一个问题(“英格兰首都?”)您似乎希望选择 “伦敦”“巴黎”“哈瓦那” ,那么问题应该有一个属性

    public List<string> PossibleAnswers { get; set; }
    

    在控制器中

    model.Questions[0].PossibleAnswers = new List<string>() { "london", "paris", "Havana" }
    

    在视图中

    for(int i = 0; i < Model.Count; i++) {
    {
    
      if (@Model[i].MultipleChoice)
      {
        // Radio buttons for multiple choice
        foreach(string option in Model[i].PossibleAnswers)
        {
          <label>   
            @Html.RadioButtonFor(m => m[i].Response, option})
            <span>@option</span>
          </label>
        }
      }
      else
      {
        // Textbox for answer
        @Html.TextBoxFor(m => m[i].Response)
      }
    }
    

    当您回帖时,Response 属性将包含答案的文本,可以是在文本框中输入的内容,也可以是选择题中的一个可能答案。

    但是,我建议您需要重新考虑您在此处所做的大部分工作,尤其是如果您希望绑定到多项选择答案的 ID 属性。

    【讨论】:

      猜你喜欢
      • 2011-10-17
      • 2020-02-17
      • 2014-06-19
      • 1970-01-01
      • 1970-01-01
      • 2020-12-10
      • 1970-01-01
      • 2012-06-13
      • 1970-01-01
      相关资源
      最近更新 更多