Add loop in an EditForm

505 Views Asked by At

I would like to create a form in Blazor with a list of questions, each having two options to choose from. I am already retrieving those from the database and I want to get the user's answers. So the EditForm should bind with an object like this:

public class Result {
   [Range(1,2, ErrorMessage = "Choose an answer")]
   public int[] Answers { get; set; }
}

In my razor component this is my html:

   <EditForm Model=@result OnSubmit=@FormSubmitted>
        @for (var i=0; i< questions.Count; i++) {
            <div>@questions[i].Statement</div>
            <InputRadioGroup TValue=int @bind-Value=result.Answers[i] class="form-control">
                <InputRadio TValue=int Value=1 />@questions[i].Option1
                <InputRadio TValue=int Value=2 />@questions[i].Option2
            </InputRadioGroup>
        }
        <input type="submit" value="Submit" class="btn btn-primary"/>
    </EditForm>

This is not working and I'm struggling to find a solution.

How should I properly bind the input and how would I implement the FormSubmitted method?

Edit:

Following your suggestions I found a solution and changed the Result class:

public class Result {
    public List<Answer> Answers ;
}

Also added a local variable for i and bound the radio group to: @bind-Value=result.Answers[local].Option

0

There are 0 best solutions below