Add a message to the grade test confirmation dialog when questions are unanswered.

When the "Grade Test" button is clicked, JavaScript parses the
`probstatus` inputs and determines what problems are in the test. Then
it finds the answer inputs in the page and determines if there are any
questions in a problem that are unanswered.  If there are any problems
with unanswered questions, then a message stating that is added to the
confirmation dialog.

This is to address the feature request in issue #2183.

Generally, this will work for most answers.  However, there are a couple
of cases that don't work right.  These are cases where answer inputs are
non-empty even if a student has not actively entered an answer.

Most notable is the case of an answer to a `draggableProof.pl` or
`draggableSubset.pl` question. The JavaScript for those always fills in
a non-empty answer as soon as the problem is loaded into the page.

Another case is if a problem uses the deprecated `PopUp` method from the
`parserPopUp.pl` macro or the deprecated methods from
`PGchoicemacros.pl`.  For example, if `PopUp([ '?', 'a', 'b', 'c' ], 1)`
is used.  That will have the non-empty value `?` for the default answer.

Unanswered questions that use the `draggableProof.pl` and
`draggableSubset.pl` macros could be determined server side, but the
only way to do so would be to process the problem via PG.  There were
several suggestions in issue #2183 to use a server side set "flag" or
have other server queries involved in this.  Those really don't help
other than in this case, and generally shouldn't be done.  We really do
not want to have a submission to the server that processes all problems
in a test to determine if there are unanswered questions before
submitting a test for grading in which all problems will again be
processed.  There was a suggestion to change the "preview test" button
into a "save answers" button, but even that doesn't really help.  It
would not be reliable, because the information would only be there if
the button were used first. There is no guarantee it would be used
first, and this needs to have the ability to process the answers
regardless.

Note that attempting to correctly determine if a question that uses
`parserPopUp.pl` or `PGchoicemacros.pl` is unanswered cannot even be
done by processing the problem.  This just adds emphasis that those
should not be used anymore.

There may be some other cases that have non-empty answers without
students actively answering a question, but I can't think of any at this
point.

One thing to note is that if a problem has never even been displayed on
the page (for example a `draggableProof.pl` problem that is on a page of
the test the student never goes to) this approach will work correctly
even for the above cases.

Author: drgrice1

htdocs/js/GatewayQuiz/gateway.js

@@ -188,6 +188,41 @@
 
 			if (actuallySubmit) return;
 
+			const inputs = Array.from(document.querySelectorAll('input, select'));
+
+			// All problem numbers are represented by a probstatus hidden input. Use those to determine the problem
+			// numbers of problems in the test. Note that problem numbering displayed on the page will not match these
+			// numbers in the cases that the test definition has non-consecutive numbering or that problem order is
+			// randomized. But the problem numbering will always match the quiz prefix numbering.
+			const problems = [];
+			for (const input of inputs.filter((i) => /^probstatus\d*/.test(i.name))) {
+				problems[parseInt(input.name.replace('probstatus', ''))] = {};
+			}
+
+			// Determine which questions have been answered.  Note that there can be multiple inputs for a
+			// given question (for example for checkbox or radio answers).
+			for (const input of inputs.filter(
+				(i) => /Q\d{4}_/.test(i.name) && !/^MaThQuIlL_/.test(i.name) && !/^previous_/.test(i.name)
+			)) {
+				const answered =
+					input.type === 'radio' || input.type === 'checkbox' ? !!input.checked : /\S/.test(input.value);
+				const match = /Q(\d{4})_/.exec(input.name);
+				const problemNumber = parseInt(match?.[1] ?? '0');
+				if (!(input.name in problems[problemNumber])) problems[problemNumber][input.name] = answered;
+				else if (answered) problems[problemNumber][input.name] = 1;
+			}
+
+			// Determine if there are any unanswered questions in each problem.
+			let numProblemsWithUnanswered = 0;
+			for (const problem of problems) {
+				// Skip problem 0 and any problems that don't exist in the test
+				// due to non-consecutive numbering in the test definition.
+				if (!problem) continue;
+
+				if (!Object.keys(problem).length || !Object.values(problem).every((answered) => answered))
+					++numProblemsWithUnanswered;
+			}
+
 			// Prevent the gwquiz form from being submitted until after confirmation.
 			evt.preventDefault();
 
@@ -224,6 +259,23 @@
 			modalBodyContent.textContent = submitAnswers.dataset.confirmDialogMessage;
 			modalBody.append(modalBodyContent);
 
+			if (numProblemsWithUnanswered) {
+				const modalSecondaryContent = document.createElement('div');
+				modalSecondaryContent.classList.add('mt-3');
+				modalSecondaryContent.textContent =
+					(numProblemsWithUnanswered > 1
+						? submitAnswers.dataset.unansweredQuestionsMessage
+							? submitAnswers.dataset.unansweredQuestionsMessage.replace('%d', numProblemsWithUnanswered)
+							: `There are ${numProblemsWithUnanswered} problems with unanswered questions.`
+						: (submitAnswers.dataset.unansweredQuestionMessage ??
+							'There is a problem with unanswered questions.')) +
+					' ' +
+					(submitAnswers.dataset.returnToTestMessage ??
+						'Are you sure you want to grade the test? ' +
+							'Select "No" if you would like to return to the test to enter more answers.');
+				modalBody.append(modalSecondaryContent);
+			}
+
 			const modalFooter = document.createElement('div');
 			modalFooter.classList.add('modal-footer');
 

templates/ContentGenerator/GatewayQuiz.html.ep

@@ -725,6 +725,15 @@
 							: maketext(
 							'This is your only submission.  If you say yes, then your answers will be final, '
 								. 'and you will not be able to continue to work this test version.'
+							),
+							# This is always a plural form. JavaScript replaces %d with the
+							# number of unanswered questions which will be greater than one.
+							unanswered_questions_message =>
+								maketext('There are [_1] problems with unanswered questions.', '%d'),
+							unanswered_question_message => maketext('There is a problem with unanswered questions.'),
+							return_to_test_message => maketext(
+								'Are you sure you want to grade the test? '
+								. 'Select "No" if you would like to return to the test to enter more answers.'
 							)
 						}
 						)