|
|
@@ -2754,56 +2754,86 @@
|
|
|
setupBackButtonHandlers();
|
|
|
});
|
|
|
document.addEventListener('livewire:load', () => {
|
|
|
- Livewire.on('focus-error-field', (fieldId) => {
|
|
|
- console.log('Validation errors received:', fieldId);
|
|
|
- let element;
|
|
|
-
|
|
|
- if (typeof fieldId === 'string') {
|
|
|
- element = document.getElementById(fieldId);
|
|
|
- } else if (Array.isArray(fieldId) && fieldId.length > 0) {
|
|
|
- const firstFieldId = fieldId[0];
|
|
|
- element = document.getElementById(firstFieldId);
|
|
|
- fieldId = firstFieldId; // Use the first fieldId for highlighting
|
|
|
- }
|
|
|
+ Livewire.on('focus-error-field', (fieldId) => {
|
|
|
+ console.log('Validation errors received:', fieldId);
|
|
|
+ let element;
|
|
|
+
|
|
|
+ if (typeof fieldId === 'string') {
|
|
|
+ element = document.getElementById(fieldId);
|
|
|
+ } else if (Array.isArray(fieldId) && fieldId.length > 0) {
|
|
|
+ const firstFieldId = fieldId[0];
|
|
|
+ element = document.getElementById(firstFieldId);
|
|
|
+ fieldId = firstFieldId; // Use the first fieldId for highlighting
|
|
|
+ }
|
|
|
|
|
|
- if (element) {
|
|
|
- element.focus();
|
|
|
- element.scrollIntoView({
|
|
|
- behavior: 'smooth',
|
|
|
- block: 'center'
|
|
|
- });
|
|
|
+ if (element) {
|
|
|
+ element.focus();
|
|
|
+ element.scrollIntoView({
|
|
|
+ behavior: 'smooth',
|
|
|
+ block: 'center'
|
|
|
+ });
|
|
|
|
|
|
- // Add the is-invalid class to highlight the field
|
|
|
- element.classList.add('is-invalid');
|
|
|
+ element.classList.add('is-invalid');
|
|
|
|
|
|
- // Also highlight the label
|
|
|
- const label = document.querySelector(`label[for="${fieldId}"]`);
|
|
|
- if (label) {
|
|
|
- label.classList.add('text-danger');
|
|
|
- }
|
|
|
+ const label = document.querySelector(`label[for="${fieldId}"]`);
|
|
|
+ if (label) {
|
|
|
+ label.classList.add('text-danger');
|
|
|
+ }
|
|
|
|
|
|
- // Prevent the class from being removed
|
|
|
- const preserveInvalidClass = () => {
|
|
|
- if (!element.classList.contains('is-invalid')) {
|
|
|
- element.classList.add('is-invalid');
|
|
|
- }
|
|
|
- };
|
|
|
+ const preserveInvalidClass = () => {
|
|
|
+ if (!element.classList.contains('is-invalid')) {
|
|
|
+ element.classList.add('is-invalid');
|
|
|
+ }
|
|
|
+ };
|
|
|
|
|
|
- // Set an interval to ensure the class stays applied
|
|
|
- const intervalId = setInterval(preserveInvalidClass, 100);
|
|
|
+ const intervalId = setInterval(preserveInvalidClass, 100);
|
|
|
|
|
|
- // Stop preserving after user interaction
|
|
|
- element.addEventListener('input', () => {
|
|
|
- clearInterval(intervalId);
|
|
|
- // Optional: Remove the highlighting when user edits the field
|
|
|
- // element.classList.remove('is-invalid');
|
|
|
- // if (label) label.classList.remove('text-danger');
|
|
|
+ element.addEventListener('input', () => {
|
|
|
+ clearInterval(intervalId);
|
|
|
+ });
|
|
|
+
|
|
|
+ } else {
|
|
|
+ console.warn('Element with id ' + fieldId + ' not found');
|
|
|
+ }
|
|
|
});
|
|
|
+ });
|
|
|
|
|
|
- } else {
|
|
|
- console.warn('Element with id ' + fieldId + ' not found');
|
|
|
+ function getNextTab(currentTab) {
|
|
|
+ const tabs = ['dati', 'tesseramento', 'corsi', 'gruppi'];
|
|
|
+ const currentIndex = tabs.indexOf(currentTab);
|
|
|
+ return currentIndex < tabs.length - 1 ? tabs[currentIndex + 1] : currentTab;
|
|
|
}
|
|
|
- });
|
|
|
-});
|
|
|
+
|
|
|
+ function scrollToFormTop() {
|
|
|
+ const formSection = document.querySelector('.section--tab, .form--wrapper, #card--resume');
|
|
|
+ if (formSection) {
|
|
|
+ formSection.scrollIntoView({
|
|
|
+ behavior: 'instant',
|
|
|
+ block: 'start',
|
|
|
+ inline: 'nearest'
|
|
|
+ });
|
|
|
+ return true;
|
|
|
+ }
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+
|
|
|
+ Livewire.on('saved-and-continue', (currentTab) => {
|
|
|
+ const nextTab = getNextTab(currentTab);
|
|
|
+ if (nextTab !== currentTab) {
|
|
|
+ @this.change(nextTab);
|
|
|
+ }
|
|
|
+
|
|
|
+ setTimeout(() => {
|
|
|
+ if (!scrollToFormTop()) {
|
|
|
+ window.scrollTo({ top: 0, behavior: 'instant' });
|
|
|
+ document.body.scrollTop = 0;
|
|
|
+ document.documentElement.scrollTop = 0;
|
|
|
+ }
|
|
|
+ const firstInput = document.querySelector('#first_name');
|
|
|
+ if (firstInput) {
|
|
|
+ firstInput.focus();
|
|
|
+ }
|
|
|
+ }, 200);
|
|
|
+ });
|
|
|
</script>
|
|
|
@endpush
|