afterwaves :
I am coding a quiz in a JSP and have a problem where the radio buttons don't seem to be working properly. The questions are stored in a MySQL database and retrieved using procedures. When the user clicks on a radio button and submits it, the code will always output 'Incorrect' even if the correct answer is selected. Whilst running through the code, I have noticed that the radio buttons seem to skip back to the previous question's answer.
For example, for question 1, the selected radio button does not return anything. On question 2, the radio button returns the answer from question 1. On question 3, it returns the answer in the same position as question 2, and so on.
How do I fix this?
I am aware that using scriptlets is bad practice; this will be resolved after I complete the development of my code.
<%
//Initalising necessary variables to be used in connection stream
Connection conn = null;
ResultSet rs = null;
Statement st = null;
//Setting SCORE and QID to 0
//Checking to see if SCORE and QID already exist
//If so, the existing value is retrieved and overwritten
//The variables now hold the existing values
int score = 0;
if(request.getParameter("score")!=null) {
score=Integer.parseInt(request.getParameter("score"));
}
int QID=1;
if(request.getParameter("QID")!=null) {
QID=Integer.parseInt(request.getParameter("QID"));
}
//Setting up connection stream to MySQL database on the server
//Using my credentials to log in and access tables
try {
Class.forName("org.mariadb.jdbc.Driver");
conn = DriverManager.getConnection(
"jdbc:mariadb://URL;
//Calling procedure to obtain question description from the stored question table in stored database
CallableStatement stmt = conn.prepareCall("{call GetQuestionTitle(?, ?)}");
stmt.setInt(1, QID);
stmt.registerOutParameter(2, Types.VARCHAR);
stmt.execute();
String description = stmt.getString(2);
%>
<%
//Calling all procedures to obtain the answers to each question stored in the database
CallableStatement answer1 = conn.prepareCall("{call GetAnswer1(?, ?)}");
answer1.setInt(1, QID);
answer1.registerOutParameter(2, Types.VARCHAR);
answer1.execute();
String answerOne = answer1.getString(2);
CallableStatement answer2 = conn.prepareCall("{call GetAnswer2(?, ?)}");
answer2.setInt(1, QID);
answer2.registerOutParameter(2, Types.VARCHAR);
answer2.execute();
String answerTwo = answer2.getString(2);
CallableStatement answer3 = conn.prepareCall("{call GetAnswer3(?, ?)}");
answer3.setInt(1, QID);
answer3.registerOutParameter(2, Types.VARCHAR);
answer3.execute();
String answerThree = answer3.getString(2);
CallableStatement answer4 = conn.prepareCall("{call GetAnswer4(?, ?)}");
answer4.setInt(1, QID);
answer4.registerOutParameter(2, Types.VARCHAR);
answer4.execute();
String answerFour = answer4.getString(2);
%>
<%
//Defining String variable CHOSENANSWER to store value of user-selected radio button
String chosenAnswer="";
if(request.getParameter("button")!=null)
{
chosenAnswer=request.getParameter("button").toString();
}
//Calling procedure to obtain the CorrectAnswer from database
CallableStatement stmt2 = conn.prepareCall("{call GetCorrectAnswer(?, ?)}");
stmt2.setInt(1, QID);
stmt2.registerOutParameter(2, Types.VARCHAR);
stmt2.execute();
String CorrectDescription = stmt2.getString(2);
System.out.println("\nCorrect Answer: " + CorrectDescription);
%>
<%
//For all questions up to Question 20 and not beyond:
if (QID < 21){
%>
<!--- QUIZ GUI --->
<!--- Creating a submit form for the radio buttons --->
<!--- Page refreshes on submit to the next question --->
<br>
<form name="Quiz" method="post" action='Quiz.jsp'>
<br>
<!--- Using a table for neater alignment with the questions and answers --->
<center>
<table border="1" width="500px" bgcolor="lightblue" cellspacing="0" cellpadding="0">
<tr>
<td width="100%">
<!--- Setting headings and radio buttons --->
<!--- Using properties to adjust text colour, font and size --->
<!--- The variables that contain the descriptions are passed in using Java scriptlets --->
<h1 align="center"><font color="white" face="arial">Quiz</font></h1>
<table border="0" width="500px" cellspacing="2" cellpadding="6">
<tr>
<td width="50%"><font color="steelblue" face="arial" size=4><span style="font-weight:normal"> QUESTION <%=QID%></span></font></td>
<tr>
<td width="100%"><font color="black" face="arial" size=4><span style="font-weight:normal"><%=description%></span></font></td></tr>
<tr>
<td>
1: <input type="radio" name="button" value= "<%=answerOne%>" /><font face="arial" size=3><%=answerOne%></font></td>
<tr>
<td>
2: <input type="radio" name="button" value="<%=answerTwo%>" /><font face="arial" size=3><%=answerTwo%></font></td>
<tr>
<td>
3: <input type="radio" name="button" value="<%=answerThree%>" /><font face="arial" size=3><%=answerThree%></font></td>
<tr>
<td>
4: <input type="radio" name="button" value="<%=answerFour%>" /><font face="arial" size=3><%=answerFour%></font></td>
<tr><td><center>
<!--- Submit button to go to next question --->
<input type="submit" value="Next" name="submit">
<!--- If the submit button is pressed: --->
<%
//Check to see if selected radio button matches CorrectAnswer procedure value
if(chosenAnswer.equals(CorrectDescription)) {
%>
<!--- Increase SCORE by 1 and output correct if answer matches correct answer --->
<input name="score" type="HIDDEN" value="<%=score+1%>" id="scoreField">
<h4 align="center"><font color="green" face="arial">Correct!</font></h4>
<%
}
else{
%>
<!--- Otherwise SCORE remains constant and an incorrect message is output --->
<input name="score" type="HIDDEN" value="<%=score%>" id="scoreField">
<h4 align="center"><font color="red" face="arial">Incorrect!</font></h4>
<%
}
System.out.println(chosenAnswer);
%>
<%
//Passing score as a session attribute so that it remains as a variable on page refresh and redirect
//session.setAttribute("Score", score);
%>
</center></td></tr>
</table>
</td>
</tr>
</table>
</center>
<!--- Increment QID by 1 to go to the next question after submit button pressed --->
<input name="QID" type="HIDDEN" value="<%=QID+1%>" id="thisField">
</form>
I have only included the parts of the code that I think is neccessary to the question.
Swati :
When your page get loads for the first time , your QID is 1 then you increment that i.e : <%=QID+1%>" and when you submit your QID becomes 2 so i think the problem is here CallableStatement stmt2 = conn.prepareCall("{call GetCorrectAnswer(?, ?)}");.. here QID which you will pass is 2 then the CorrectDescription will fetch correct answer of question 2 not question 1 , that's why its giving Incorrect! . Now to solve this you can add one new input under your <form> tag. i.e:
<input type="hidden" name="current_question" value="<%=QID%>"/>
and then get it like below :
int previous_question_no;
String chosenAnswer="";
if(request.getParameter("button")!=null)
{
chosenAnswer=request.getParameter("button").toString();
//getting question no which is submitted
previous_question_no=Integer.parseInt(request.getParameter("current_question"));
}
//Calling procedure to obtain the CorrectAnswer from database
CallableStatement stmt2 = conn.prepareCall("{call GetCorrectAnswer(?, ?)}");
//passing same question no
stmt2.setInt(1, previous_question_no);
stmt2.registerOutParameter(2, Types.VARCHAR);
..