Question

I am trying to create a question and answers page. In which I am adding a question through textbox and want to add 4 textboxes to get answer option. I am using this model.

public class Question
    {
        public virtual int ID { get; set; }
        public virtual QPad QPad { get; set; }
        [Display(Name = "Add Question")]
        public virtual string QuestionText { get; set; }        
        [Display(Name = "Add Options")]
        public virtual IList<string> AnswerOption { get; set; }
    }

But now in a create action’s view of QuestionController

My controller is:

[HttpPost]
        public ActionResult Index(int qId, Question ques )
        {
            if (ModelState.IsValid)
            {
                var QPads = _db.QPads.Single(r => r.ID == qId);
                QPads.Questions.Add(ques);
                _db.SaveChanges();
                return RedirectToAction("Index", "QPad");
            }
            else
            {
                return View(ques);
            }
        }

I want to add editor for question text and options, I use

<div class="editor-label">
            @Html.LabelFor(model => model.QuestionText)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.QuestionText)
            @Html.ValidationMessageFor(model => model.QuestionText)
        </div>
/// ?????What for  4 Options boxes///////?

I am not able to add option boxes. Am I using correct approach in models or should I change something ?

or can I customize that user itself select how much options he wants to add ?

Please suggest ?

Answer 1

If the use is always allowed to add four options then I may try something like this.

<div class="editor-label">
  @Html.LabelFor(model => model.QuestionText)
</div>
<div class="editor-field">
  @Html.EditorFor(model => model.QuestionText)
   @Html.ValidationMessageFor(model => model.QuestionText)
</div>
@for(int i = 0; i < 4; i++)
{
  <div class="editor-field">
     @Html.EditorFor(model => model.AnswerOption[i])
     @Html.ValidationMessageFor(model => model.AnswerOption[i])
  </div>
}