所以,我正在使用EJS作为模板引擎使用jQuery,Bootstrap和MySql创建一个Quiz创建应用程序。
我正在尝试根据测验循环出问题的相应答案。
所以,假设我通过路由呼叫启动quizd2测验。 我得到了2个问题的测验2。我在ejs代码中使用forEach()循环,但我无法弄清楚如何循环正确答案的正确答案?
<div class="content col-lg-12 col-md-12 col-sm-12 col-xs-12">
<h1>
<% loadQuizes.forEach(function (quizes) { %>
<h2><%= quizes.quizName %></h2> <!-- Load the name of quiz-->
<% }) %>
</h1>
<form action="/takequiz" method="POST">
<% quizQuestions.forEach(function (questions) { %> <!-- Load question by question WHERE questionQuizId = ? -->
<div class="well well-sm">
<h3><%= questions.question %></h3> <!-- Print question -->
<% answers.forEach(function (ans) { %><!-- Load answers by answers WHERE answerQuestionid = ? -->
<%= ans.answer %><br> <!-- Print answers followed by checkbox -->
<% }) %> <!-- End loading answers -->
</div> <!-- well -->
<% }) %> <!-- End loading question -->
</form> <!-- form --> </div> <!-- content -->
我的表格看起来像这样:
mysql> SELECT * FROM quiz;
+--------+------------------------+---------------------+--------------+-------+-------+
| quizId | quizName | dateCreated | dateFinished | times | score |
+--------+------------------------+---------------------+--------------+-------+-------+
| 1 | Solution to everything | 2017-03-03 16:14:02 | 2017-03-03 | 2 | 20 |
| 2 | Bergskedjor | 2017-03-03 16:14:02 | 2017-03-03 | 2 | 20 |
+--------+------------------------+---------------------+--------------+-------+-------+
2 rows in set (0.00 sec)
mysql> SELECT * FROM question;
+------------+-------------------------------------------+----------------+
| questionId | question | questionQuizid |
+------------+-------------------------------------------+----------------+
| 1 | What color is the Sky? | 1 |
| 2 | Vilket ├ñr v├ñrldens h├Âgsta berg? | 2 |
| 3 | Vilket ├ñr v├ñrldens tredje h├Âgsta berg? | 2 |
+------------+-------------------------------------------+----------------+
3 rows in set (0.00 sec)
mysql> SELECT * FROM answers;
+----------+---------------------+---------+------------------+
| answerId | answer | correct | answerQuestionid |
+----------+---------------------+---------+------------------+
| 1 | Red | 0 | 1 |
| 2 | Green | 0 | 1 |
| 3 | Blue | 1 | 1 |
| 4 | Pink | 0 | 1 |
| 5 | Red | 0 | 1 |
| 6 | Question 1 Answer 1 | 0 | 2 |
| 7 | Question 1 Answer 2 | 1 | 2 |
| 8 | Question 1 Answer 3 | 0 | 2 |
| 9 | Question 2 Answer 1 | 0 | 3 |
| 10 | Question 2 Answer 2 | 0 | 3 |
| 11 | Question 2 Answer 3 | 1 | 3 |
+----------+---------------------+---------+------------------+
11 rows in set (0.00 sec)
当然还有来自地狱的回调循环:)
app.get('/takequiz/:id', function(req, res) {
connection.acquire(function (err, con) {
var quizId = req.params.id;
con.query('SELECT * FROM quiz WHERE quizId = ?', quizId, function (err, qid) {
if(err) {
console.log(err);
} else {
con.query('SELECT * FROM question WHERE questionQuizId = ?', quizId, function (err, question) {
if (err) {
console.log(err);
} else {
con.query('SELECT * FROM answers WHERE answerQuestionid IN (SELECT questionId FROM question WHERE questionQuizid = ?)', quizId, function (err, answer) {
console.log(answer);
con.release();
if (err) {
console.log(err);
} else {
loadQuizes = JSON.parse(JSON.stringify(qid));
quizQuestions = JSON.parse(JSON.stringify(question));
answers = JSON.parse(JSON.stringify(answer));
res.render('takequizbyid', {
loadQuizes: loadQuizes,
quizQuestions: quizQuestions,
answers: answers,
title: 'Take quiz',
classname: 'takequizbyid'
});
}
});
}
});
}
});
}
);
});
结果如下: Result
答案 0 :(得分:0)
找到一个更好问题的解决方案:solution
介绍逻辑:
<% quizQuestions.forEach(function (question) { %>
<div class="well well-sm">
<h3><%= question.question %></h3>
<% answers.forEach(function (ans) { %>
<% if (ans.answerQuestionid === question.questionId) { %>
<%= ans.answer %><br>
<% } %>
<% }) %>
</div> <!-- well -->
<% }) %>