Fixed issue #15615: Mandatory multiple choice questions are not assig…

…ned a red background if not being answered (#1577)

* Fixed issue #15615: Mandatory multiple choice questions are not assigned a red background if not being answered

Added new event handler for question-container, to evaluat status of its tips and then add/remove the error class

* Fixed issue #15615: Mandatory multiple choice questions are not assigned a red background if not being answered

Code review

assets/packages/template-core/template-core.js

@@ -81,8 +81,8 @@ var TemplateCoreClass = function () {
                         $parent.removeClass('hide-tip', 1);
                         $parent.addClass('tip-was-hidden', 1);
                     }
-                    $questionContainer = $(this).parents('div.question-container');
-                    $questionContainer.addClass('input-error'); /* No difference betwwen error after submit and error before submit : think (Shnoulle) it's better to have a difference */
+                    var questionContainer = $(this).parents('div.question-container');
+                    window.templateCore.updateQuestionClassFromTips(questionContainer);
                 });
 
                 $(this).on('classChangeGood', function () {
@@ -93,12 +93,25 @@ var TemplateCoreClass = function () {
                     if ($parent.hasClass('tip-was-hidden')) {
                         $parent.removeClass('tip-was-hidden').addClass('hide-tip');
                     }
-                    $questionContainer = $(this).parents('div.question-container');
-                    $questionContainer.removeClass('input-error'); /* Not working with mandatory question ... */
+                    var questionContainer = $(this).parents('div.question-container');
+                    window.templateCore.updateQuestionClassFromTips(questionContainer);
                 });
             });
-
-
+        },
+        /**
+         * Set error class on question container depending on validation tips status.
+         * 
+         * If any tip is marked as error (has 'text-danger' class), 'input-error' is added to
+         * the question container. Otherwise, 'input-error' is removed from the question container.
+         * 
+         * @param {Element} questionContainer 
+         */
+        updateQuestionClassFromTips: function(questionContainer) {
+            if (questionContainer.find('.question-valid-container .text-danger').length == 0) {
+                questionContainer.removeClass('input-error');
+            } else {
+                questionContainer.addClass('input-error');
+            }
         },
         /**
          * Hide/show question if all sub-questions is hidden