Wie es der Zufall will, arbeite ich auch gerade an so etwas :) Die schlechte Nachricht ist, dass der Code ein wenig umfangreicher ist. Hier ein Beispiel... unten die Erklärung.
// Completion check
$cStart = (
(count(array_intersect(getItems('KD01', 'valid'), [2,3,4,5,6,8])) == 6) and
(value('KD02') > 0) and
((value('KD03') > 0) or (value('KD03') == -2))
);
// u.s.w. für jeden einzelnen Menüpunkt
// Navigation
html('<div style="border: 2px solid #CCCCCC; border-left: 0 none; border-right: 0 none; padding: 20px 0 12px 0; margin-bottom: 3em;">'.
'<div class="s2flex IfKWButtons" style="flex-wrap: wrap; margin-right: -8px">'.NL.
buttonToPage('start').
buttonToPage('kontakt', NULL, NULL, ($cStart ? 'complete' : 'incomplete')).
buttonToPage('section1', NULL, NULL, ($cSection1 ? 'complete' : 'incomplete')).
buttonToPage('section2', NULL, NULL, ($cSection2 ? 'complete' : 'incomplete')).
buttonToPage('dokumente', NULL, NULL, ($cDokumente ? 'complete' : 'incomplete')).
buttonToPage('notizen').
'<div style="width: 2em;"></div>'.
buttonToPage('abschicken').
'</div>'.
'</div>'
);
option('nextbutton', 'Nächstes Formular');
Das "Feedback" wird hier direkt in der Navigation (Buttons zu den einzelnen Teilen des Fragebogens) angezeigt Und zwar wurden dafür die folgenden beiden CSS-Klassen im Layout definiert:
div.navButtons button.complete:after { content: " \2713"; }
div.navButtons button.incomplete:after { content: " \274C"; }
div.navButtons button.currentPage:after { content: none; }
Zu Beginn des PHP-Codes wird mittels value()
und getItems()
geprüft, ob ein Formular vollständig ausgefüllt ist. Je nachdem, wir eine Variable auf true
oder false
gesetzt. Und abhängig davon wird dann entweder die CSS-Klasse complete
oder incomplete
für den Navigations-Button gesetzt.
Sie sehen, ich habe oben nur den Complete-Check für eine Seite ... wie gesagt: Ein wenig aufwändiger ist das Ganze schon. Zumal in meinem Beispiel-Code einige Eingabefelder einer offenen Texteingabe durch Dropdowns und andere Eingabefelder ersetzt wurden...