单选按钮问题 ASP.Net Core Razor Pages

Issue With Radio Buttons ASP.Net Core Razor Pages

我目前在尝试使用剃须刀页面和 ASP.net 核心通过单选按钮从多项选择答案选项中 post 信息时遇到问题。 我找到了一些有关 MVC 的信息,但无法完全解决我的问题。

我有一个 Razor 页面,其中显示了一个问题列表,并在每个问题中显示了可能的答案选项。 这是我的表格:

<form method="post">
    @for (int i = 0; i < Model.Questions.Count(); i++)
    {
        <h4>@Model.Questions.ElementAt(i).QuestionBody</h4>
        <input type="hidden" asp-for="Question.QuestionBody" />

        @foreach (var answer in Model.Answers)
        {
            var groupID = "question" + i;

            <div class="input-group">
                <div class="input-group-prepend">
                    <div class="input-group-text">
                        <input type="radio" name="@groupID" />
                        <label>answer.AnswerBody</label>
                    </div>
                </div>
            </div>
        }
    }
    <button type="submit" class="btn btn-primary">Save</button>
</form>

根据我读过的信息,我认为我需要删除名称属性,但目前它是将我对正确问题的答案分组并允许我每页 select 多个答案。

包含表单的 ApTest razor 页面的页面模型是

public class ApTestModel : PageModel
    {
        private readonly IConfiguration config;
        public IApTestData ApTestData { get; set; }

        [BindProperty]
        public IEnumerable<Question> Questions { get; set; }
        [BindProperty]
        public Question Question { get; set; }
        public int QuestionID { get; set; }
        [BindProperty]
        public List<Answer> Answers { get; set; }
        [BindProperty]
        public Answer Answer { get; set; }
        [BindProperty]
        public TestAttempt TestAttempt { get; set; }


        public ApTestModel(IConfiguration config, IApTestData ApTestData)
        {
            this.config = config;
            this.ApTestData = ApTestData;
        }

        public void OnGet()
        {
            Questions = ApTestData.GetQuestionsAndAnswers(QuestionID);

        }

        public void OnPost()
        {
            AppUser appUser = new AppUser
            {
                Email = User.Identity.Name,
            };

            ApTestData.SaveApTestAttempt(Answers, appUser);
        }
    }
}

SaveApTestAttempt 方法在这里:

public void SaveApTestAttempt(List<Answer> answers, AppUser appUser)
        {
            var tempAppUser = db.Users.SingleOrDefault(user => user.Email == appUser.Email);
            foreach (var answer in answers)
            {
                TestAttempt testAttempt = new TestAttempt
                {
                    SelctedAnswer = answer,
                    Applicant = appUser,
                    ApplicantID = tempAppUser.Id
                };

                db.TestAttempts.Add(testAttempt);
            }
        }

涉及的实体是问题、答案和测试尝试(全部分开 类 但在此处合并以便于查看):

 public class Question
    {
        public int ID { get; set; }
        public string QuestionBody { get; set; }
        public List<Answer> Answers { get; set; }
        public QuestionTypeID QuestionTypeID { get; set; }
        public QuestionType QuestionType { get; set; }

        public Question()
        {
            Answers = new List<Answer>();
        }
    }

public class Answer
    {
        public int ID { get; set; }
        public string AnswerBody { get; set; }
        public bool IsCorrect { get; set; }
        public Question Question { get; set; }
        public int QuestionID { get; set; }
    }

public class TestAttempt
    {
        [Key]
        public int ID { get; set; }
        public AppUser Applicant { get; set; }
        public string ApplicantID { get; set; }
        public Answer SelctedAnswer { get; set; }
        public int AnswerID { get; set; }


    }

我知道我应该在我的表单中绑定和使用 asp-for 但我已经尝试过这样做以及删除 name 属性并添加一个值但我认为我从未添加过正确的事情。 我用的是 Model.Questions.ElementAt(i).Answers[j].AnswerID

对 ASP.Net 核心世界还是相当陌生,正在为我的大学做论文项目, 任何帮助将不胜感激!!

模型绑定在源中查找名称模式 prefix.property_name。如果什么都找不到,它只查找 property_name 而没有您为 @groupID 定义的 prefix.What cannot be bound to the model due to the name does not match to the 属性 name .

你的代码还有另一个错误是你没有在处理程序中定义 Answers 而是在剃刀页面中循环它,这是不可能的。

public class ApTestModel : PageModel
{
    private readonly IConfiguration config;

    [BindProperty]
    public IEnumerable<Question> Questions { get; set; }
    [BindProperty]
    public Question Question { get; set; }
    public int QuestionID { get; set; }
    [BindProperty]
    public List<Answer> Answers { get; set; }
    [BindProperty]
    public Answer Answer { get; set; }
    [BindProperty]
    public TestAttempt TestAttempt { get; set; }


    public PrivacyModel(IConfiguration config)
    {
        this.config = config;
    }

    public void OnGet()
    {
        Questions = new List<Question>()
        {
            new Question(){
                ID=1,
                QuestionBody="question1"                    
            },
            new Question(){
                ID=2,
                QuestionBody="question2"
            },
            new Question(){
                ID=3,
                QuestionBody="question3"
            }
        };
        Answers = new List<Answer>(){
                    new Answer() {ID=1, AnswerBody="an1", QuestionID=1} ,
                    new Answer() {ID=2, AnswerBody="an2", QuestionID=1} ,
                    new Answer() {ID=3, AnswerBody="an3", QuestionID=1} 
                };
    }

    public void OnPost()
    {
        AppUser appUser = new AppUser
        {
            Email = "aaaa",
        };

        SaveApTestAttempt(Answers, appUser);
    }
    public void SaveApTestAttempt(List<Answer> answers, AppUser appUser)
    {
        //...
    }
}

像下面这样更改你的剃须刀页面(不确定答案 class 中的哪个值你想绑定到无线电 button.You 可以自己更改名称):

<form method="post">
    @for (int i = 0; i < Model.Questions.Count(); i++)
    {
        <h4>@Model.Questions.ElementAt(i).QuestionBody</h4>
        <input type="hidden" name="[@i].QuestionBody" asp-for="@Model.Questions.ElementAt(i).QuestionBody" />

        @foreach (var answer in Model.Answers)
        {
            var groupID = "[" + i + "].AnswerBody";
            <input type="hidden" asp-for="@answer.ID" />
            <div class="input-group">
                <div class="input-group-prepend">
                    <div class="input-group-text">
                     <input type="radio" name="@groupID" value="@answer.AnswerBody" />
                        <label>@answer.AnswerBody</label>
                    </div>
                </div>
            </div>
        }
    }
    <button type="submit" class="btn btn-primary">Save</button>
</form>

结果: