ASP.NET MVC Multiple choice survey

Question

I'm creating a simple survey using ASP.NET MVC. The administrator will create questions answerable by 3 options only - Strongly agree, somewhat agree, strongly disagree) via the Create View.

The user will then have to select their answer using radiobutton.

1. How should I add it in my view?

Currently, this is how my view looks like (I know this is still wrong as im still trying to understand how to do this correctly):

<table class="table">
    <tr>
        <th>
            Question
        </th>
        <th class="text-center">
            Strongly Agree
        </th>
        <th class="text-center">
            Somewhat Agree
        </th>
        <th class="text-center">
            Strongly Disagree
        </th>
    </tr>

    @foreach (var item in Model)
    {
        <tr>
            <td>
                @Html.DisplayFor(modelItem => item.Question)
            </td>
            <td align="center">
                @Html.RadioButtonFor(modelItem => item.Answer, "Strongly Agree", new { QuestionID = item.QuestionID })
            </td>
            <td align="center">
                @Html.RadioButtonFor(modelItem => item.Answer, "Somewhat Agree", new { QuestionID = item.QuestionID })
            </td>
            <td align="center">
                @Html.RadioButtonFor(modelItem => item.Answer, "Strongly Disagree", new { QuestionID = item.QuestionID })
            </td>
        </tr>
    }

</table>

2. How would I get the selected answer of the user for each question and save it to my database?

My tables are as follows:

tblTestProper: [QuestionID, UserID, Answer]

tblQuestions: [QuestionID, Question]

Are there any examples or ideas I can follow to achieve this? Thanks for any help.

Answer 1

 <table class="table">
                <tr>
                    <th></th>
                    <th></th>
                    <th>Question</th>
                    <th></th>
                    <th></th>
                    <th class="text-center">Strongly Agree</th>
                    <th class="text-center">Somewhat Agree</th>
                    <th class="text-center">Strongly Disagree</th>
                </tr>

                @for (int i = 0; i < Model.Count(); i++)
                {
                    <tr>   
                        <td>@Html.HiddenFor(m => m[i].AnswerID)</td>
                        <td>@Html.HiddenFor(m => m[i].QuestionID)</td>
                        <td>@Html.DisplayFor(m => m[i].Question)</td>
                        <td>@Html.HiddenFor(m => m[i].QuestionTag)</td>
                        <td align="right">@Html.ValidationMessageFor(m => m[i].Answer, "", new { @class = "text-danger" })</td>
                        <td align="center">@Html.RadioButtonFor(m => m[i].Answer, 1)</td>
                        <td align="center">@Html.RadioButtonFor(m => m[i].Answer, 2)</td>
                        <td align="center">@Html.RadioButtonFor(m => m[i].Answer, 3)</td>
                    </tr>
                }
            </table>

Answer 2

I think hope you helpful this

html code like this

    <label class="form-radio form-normal active form-text">1<input type="radio" class="rdomcqans" name="qug1" value="1"></label>
    <label class="form-radio form-normal active form-text">2<input type="radio" class="rdomcqans" name="qug1" value="2"></label>
    <label class="form-radio form-normal active form-text">3<input type="radio" class="rdomcqans" name="qug1" value="3"></label>
    <label class="form-radio form-normal active form-text">4<input type="radio" class="rdomcqans" name="qug1" value="4"></label>
    <!--qug1 = Question Group 1-->
    </br>
    <label class="form-radio form-normal active form-text">1<input type="radio" class="rdomcqans" name="qug2" value="1"></label>
    <label class="form-radio form-normal active form-text">2<input type="radio" class="rdomcqans" name="qug2" value="2"></label>
    <label class="form-radio form-normal active form-text">3<input type="radio" class="rdomcqans" name="qug2" value="3"></label>
    <label class="form-radio form-normal active form-text">4<input type="radio" class="rdomcqans" name="qug2" value="4"></label>
    <!--qug2 = Question Group 2-->
    <input type="hidden" id="McqAnswerListArray" name="McqAnswerListArray" />

    <script>
        $('.rdomcqans').on('change', function () {
            var McqAnswerListArray="";
            var count = 0;
            McqAnswerListArray += "";
            $('.rdomcqans:checked').each(function () {

                if (count == 0) {            
                    McqAnswerListArray += $(this).attr('name')+ ":" + $(this).val();
                } else {
                    McqAnswerListArray += ",";
                    McqAnswerListArray += $(this).attr('name') + ":" + $(this).val();
                }

                count++;
            });

            $('#McqAnswerListArray').val(McqAnswerListArray);
        });
    </script>

Controller Should be like this

You should be import using Newtonsoft.Json;

[HttpPost]
public ActionResult MCQ(String McqAnswerListArray) {
    string[] Jsonn = mcm.McqAnswerListArray.Split(',');

    for (int i = 0; i < Jsonn.Count(); i++) {
        string s = Jsonn[i];
        string[] obj = s.Split(':');
        string strqid = obj[0].ToString();
        int qid = Convert.ToInt32(strqid.Substring(3, strqid.Length - 3));//Get Question Group Number
        int Answer = Convert.ToInt32(obj[1].ToString());//Get Group Answer
        //You Can save Your answer bellow
    }
}