How to pass data from radio buttons to a model that is made by another model ASP.NET Core 6 MVC

Question

I have a questionnaire with 4 radio buttons and I need to pass the answers to the model in order to insert the answers into the database. The problem is that the model that displays the questionnaire has another model inside. How can I pass the data into the model in the [HttpPost] in the controller?

In a Services folder, I have these methods

public async Task<IEnumerable<Examen>> ObtenerReactivosUnidad1()
{
    using var connection = new SqlConnection(connectionString);
    var queryUnidad1 = "SELECT * FROM Examen " +
        "               INNER JOIN Unidad1 ON Examen.PreguntaId = Unidad1.PreguntaId " +
        "               WHERE Examen.UnidadId = 'Unidad1' AND Examen.ExamenId = 'b005BeU2022'";
    return await connection.QueryAsync<Examen>(queryUnidad1);
}

public async Task<IEnumerable<Examen>> ObtenerReactivosUnidad2()
{
    using var connection = new SqlConnection(connectionString);
    var queryUnidad2 = "SELECT * FROM Examen " +
        "               INNER JOIN Unidad2 ON Examen.PreguntaId = Unidad2.PreguntaId " +
        "               WHERE Examen.UnidadId = 'Unidad2' AND Examen.ExamenId = 'b005BeU2022'";
    return await connection.QueryAsync<Examen>(queryUnidad2);
} 

In the models, I have:

public class Examen
{
    public int Id { get; set; }
    public string PreguntaId { get; set; }
    public string Respuesta_Alumno { get; set; }
    public string Pregunta { get; set; }
    public string Respuesta1 { get; set; }
    public string Respuesta2 { get; set; }
    public string Respuesta3 { get; set; }
    public string Respuesta4 { get; set; }
}

public class ViewModel
{
    public IEnumerable<Examen> ReactivosUnidad1 { get; set; }
    public IEnumerable<Examen> ReactivosUnidad2 { get; set; }
}

And in the controller:

public async Task<IActionResult> Examen()
{            
    ViewModel mimodelo = new ViewModel();
    mimodelo.ReactivosUnidad1 = await repositorioExamen.ObtenerReactivosUnidad1();
    mimodelo.ReactivosUnidad2 = await repositorioExamen.ObtenerReactivosUnidad2();
    return View(mimodelo);
}

This is the view:

@using ENCB_Placement_Test;
@model ViewModel
@{
    var contador = 1;
}
 
<div asp-validation-summary="ModelOnly" class="text-danger"></div>
<form asp-action="Examen">
    @foreach (var reactivo in Model.ReactivosUnidad1)
    {
        <div class="mb-3">
            <label class="form-label">@contador . @reactivo.Pregunta</label>
            <div class="form-check">
                <input class="form-check-input" type="radio" id="Respuesta_Alumno" name="Respuesta_Alumno" value="Respuesta1" checked="checked" />                
                <label class="form-check-label">@reactivo.Respuesta1</label>
            </div>
            
            <div class="form-check">
                <input class="form-check-input" type="radio" id="Respuesta_Alumno" name="Respuesta_Alumno" value="Respuesta2" />
                <label class="form-check-label">@reactivo.Respuesta2</label>
            </div>
            
            <div class="form-check">
                <input class="form-check-input" type="radio" id="Respuesta_Alumno" name="Respuesta_Alumno" value="Respuesta3" />               
                <label class="form-check-label">@reactivo.Respuesta3</label>
            </div>
            
            <div class="form-check">
                <input class="form-check-input" type="radio" id="Respuesta_Alumno" name="Respuesta_Alumno" value="Respuesta4" />
                <label class="form-check-label">@reactivo.Respuesta4</label>
            </div>            
        </div>
        contador++;
    }
    <button type="submit" class="btn btn-primary">Terminar</button>
</form>

Answer 1

Your Exam Model design is unreasonable. Did you find all the radio options and only one can be selected?

Suggestion:

1. If you have to keep the current table design structure, it is possible, but you cannot use submit to submit directly. You need to use ajax to read the options in the answer and assign them to Respuesta_Alumno manually.

2. Generally, for needs like yours, at least two tables should be designed, one is the question table, and the other is the answer table.

Like:

public class Examen
{
    public int Id { get; set; }
    public string PreguntaId { get; set; }
    public string Pregunta { get; set; }
    public string Respuesta1 { get; set; }
    public string Respuesta2 { get; set; }
    public string Respuesta3 { get; set; }
    public string Respuesta4 { get; set; }
}
public class Alumno
{
    public int Id { get; set; }
    public string PreguntaId { get; set; }
    public string AlumnoId { get; set; }
    public string Respuesta_Alumno { get; set; }
}

Finally, you only need to submit the Alumno table data.