Formular: Auswahlfeld über Dateipfade
Veröffentlichungsdatum: 19. Juni 2020
Änderungsdatum: 26. Juni 2020
weblication cms formular auswahlfeld auswahlbox select liste
Über ein Auswahlfeld soll der Seitenbesucher direkt bestimmte Seiten aufrufen.
Sie wollen dem Seitenbesucher die Möglichkeit geben, über ein Auswahlfeld auf bestimmte Unterseiten zu navigieren?
Nutzen Sie hierfür z.B. das Formular Weblic®, über welches Sie eine Liste über die gewünschten Dateien generieren und als Auswahlfeld ausgeben. Dies bietet sich z.B. für eine Sprachwahl, Länderauswahl, Produktauswahl u.v.m. an.
Schritt 1: Formular-Element einfügen und definieren
Fügen Sie in der Seite, in welcher die Auswahl gewünscht ist, über den Struktureditor ein Formular-Element ein.
Im Formular löschen Sie alle Formular-Elemente, auch die Absende- / Löschen-Schaltflächen und fügen das Formular-Element "Auswahlfeld (select, dropdown)" ein.
Nun könnten Sie bei den Auswahlmöglichkeiten grundsätzlich die gewünschten Dateipfade auch manuell eintragen, z.B.:
/de/laender/deutschland.php|Deutschland
/de/laender/oesterreich.php|Österreich
/de/laender/schweiz.php|Schweiz
Bei mehr Dateien bzw. für mehr Flexibilität bietet es sich aber an, diese Dateipfade über eine Listenfunktion zu generieren und beliebig mit Informationen füllen. Sie können beide Möglichkeiten aber auch kombinieren.
Im Formularfeld "Vor der Erstellung auszuführendes Skript" definieren Sie über Frameworkfunktionen der wList-Klasse eine Liste und lesen über die wDocumentData-Klasse den Titel der aufzulistenden Dateien aus.
Beispiel: Auszug aus dem Formularfeld "Vor der Erstellung auszuführendes Skript"
// Listenoptionen für Selectfeld definieren
$listParameters['dir'] = '/de/laender';
$listParameters['orderBy'] = "/wd:stat/@path";
$listParameters['orderDir'] = 'asc';
$listParameters['orderType'] = 'natLocal';
// Auslesen der Daten als Array
$result = wList::createListArray($listParameters);
// Schleife zum ergänzen der Optionen für das Selectfeld
for($i = 0; $i < count($result); $i++){
$this->elements['countrySelection']->addOption($result[$i], wDocumentData::getDataAsHTML($result[$i], 'title'));
}
Da dieses Formular nicht zu versenden einer E-Mail, sondern zum Ansteuern der entsprechenden Seite gedacht ist, wurden zuvor auch die Schaltflächen für Absenden bzw. Löschen rausgenommen.
Schritt 2: JavaScript einfügen und definieren
Damit das Formular nicht über einen Absenden-Button abgeschickt werden muss, sondern bereits nach Auswahl eines Wertes (hier: eines Landes) aufgerufen wird, fügen Sie unterhalb des Formular-Elemtenes ein "JavaScript einbinden" Element über den Struktureditor ein.
Hier notieren Sie nachfolgenden JavaScript-Code im Feld "JavaScript Quelltext", um bei Auswahl eines Wertes direkt die zugehörigen Seite aufzurufen.
Beispiel: Auszug aus JavaScript einbinden Element
jQuery('#countrySelection').on('change', function(){
jQuery( location ).attr("href", jQuery(this).val());
});Zusätzlich verlinken Sie im Feld "Pfade der JavaScript Dateien" die jquery.js Datei, welche im globalen Projekt abliegt (z.B.: /default-wGlobal/wGlobal/layout/scripts/jquery.js).