done lms mutu soal

resources/views/soal/index.blade.php

@@ -731,7 +731,7 @@
     const summaryHal = document.getElementById('summary-hal');
     const totalHal = halList.length || 1;
     const nonConsentFields = document.querySelectorAll('[data-field-hal]:not([data-consent-input="1"])');
-    const consentFields = document.querySelectorAll('[data-consent-input="1"]');
+    const consentFields = document.querySelectorAll('[data-consent-input="1"][name]');
     const headSoalCard = document.getElementById('head_soal');
     const consentNegativeKeywords = ['tidak', 'tidak setuju'];
     let immediateSubmitActive = false;
@@ -855,6 +855,7 @@
       }
       updateQuestionVisibility();
       updateNavigationUI();
+      scrollPageToTop();
     }
 
     function validateHal(halValue) {
@@ -893,11 +894,13 @@
       const isFirst = currentIndex <= 0;
       const isLast = currentIndex === halList.length - 1;
 
+      const consentBlocked = hasIncompleteConsentForHal(currentHal);
+
       if (prevButton) {
         prevButton.disabled = immediateSubmitActive ? true : isFirst;
       }
       if (nextButton) {
-        if (immediateSubmitActive) {
+        if (immediateSubmitActive || consentBlocked) {
           nextButton.style.display = 'none';
         } else {
           nextButton.style.display = '';
@@ -906,10 +909,12 @@
       }
 
       navHalButtons.forEach(function (button) {
-        const isActive = parseInt(button.dataset.navHal, 10) === currentHal;
+        const targetHal = parseInt(button.dataset.navHal, 10);
+        const isActive = targetHal === currentHal;
+        const movingForward = targetHal > currentHal;
         button.classList.toggle('btn-primary', isActive);
         button.classList.toggle('btn-outline-primary', !isActive);
-        button.disabled = immediateSubmitActive;
+        button.disabled = immediateSubmitActive || (consentBlocked && movingForward);
       });
 
       const progress = totalHal > 0 ? Math.round(((currentIndex + 1) / totalHal) * 100) : 100;
@@ -1163,6 +1168,58 @@
       return value === '';
     }
 
+    function hasIncompleteConsentForHal(halValue) {
+      if (!halValue || formLocked) {
+        return false;
+      }
+      const fields = form.querySelectorAll('[data-consent-input="1"][name][data-field-hal="' + halValue + '"]');
+      if (!fields.length) {
+        return false;
+      }
+      const groupMap = {};
+      let needsValue = false;
+
+      fields.forEach(function (field) {
+        if (!field || field.disabled) {
+          return;
+        }
+        const type = (field.type || '').toLowerCase();
+        const tagName = (field.tagName || '').toLowerCase();
+
+        if (type === 'radio' || type === 'checkbox') {
+          const groupName = field.name || field.id || ('consent-' + halValue);
+          if (!groupMap[groupName]) {
+            groupMap[groupName] = [];
+          }
+          groupMap[groupName].push(field);
+          return;
+        }
+
+        if (tagName === 'select') {
+          if (field.value === null || field.value === '') {
+            needsValue = true;
+          }
+          return;
+        }
+
+        const value = (field.value || '').toString().trim();
+        if (!value) {
+          needsValue = true;
+        }
+      });
+
+      if (needsValue) {
+        return true;
+      }
+
+      return Object.keys(groupMap).some(function (groupName) {
+        const fieldsInGroup = groupMap[groupName] || [];
+        return !fieldsInGroup.some(function (input) {
+          return input.checked;
+        });
+      });
+    }
+
     function setupDualFormInputs() {
       document.querySelectorAll('[data-dual-wrapper]').forEach(function (wrapper) {
         const detailId = wrapper.getAttribute('data-dual-wrapper');
@@ -1214,12 +1271,18 @@
         return;
       }
       consentFields.forEach(function (field) {
-        field.addEventListener('change', function (event) {
+        const handleChange = function () {
-          if (field.type === 'radio' && !field.checked) {
+          const type = (field.type || '').toLowerCase();
+          if ((type === 'radio' || type === 'checkbox') && !field.checked) {
             return;
           }
-          evaluateConsentValue(event.target.value);
+          evaluateConsentValue(field.value);
-        });
+        };
+
+        field.addEventListener('change', handleChange);
+        if (shouldUseInputEvent(field)) {
+          field.addEventListener('input', handleChange);
+        }
 
         if (
           (field.type === 'radio' && field.checked) ||
@@ -1231,6 +1294,15 @@
       });
     }
 
+    function shouldUseInputEvent(field) {
+      const tagName = (field.tagName || '').toLowerCase();
+      const type = (field.type || '').toLowerCase();
+      if (tagName === 'textarea') {
+        return true;
+      }
+      return type === 'text' || type === 'number' || type === 'range';
+    }
+
     function evaluateConsentValue(value) {
       const normalized = (value || '').toString().trim().toLowerCase();
       const shouldStop = consentNegativeKeywords.some(function (keyword) {
@@ -1255,6 +1327,17 @@
       });
       updateNavigationUI();
     }
+
+    function scrollPageToTop() {
+      if (typeof window === 'undefined' || typeof window.scrollTo !== 'function') {
+        return;
+      }
+      try {
+        window.scrollTo({ top: 0, behavior: 'smooth' });
+      } catch (error) {
+        window.scrollTo(0, 0);
+      }
+    }
   });
 </script>