Leckeres aus der IT-Welt

Typo3: Kategorie-Filter für tt_news bauen – Teil 2

Heute gehts endlich weiter mit meinem kleinem Typo3-Tutorial (Teil 1). In zweiten Teil wollen wir nun den HTML-Codes des Formulars per Typoscript erzeugen.

News-Kategorien auslesen

Die News-Kategorien können mit dem folgenden TypoScript-Schnipsel ausgelesen werden. Das HTML-Grundgerüst drumherum kann mit TEXT oder HTML-Objekten erzeugt werden.

get_categories = CONTENT
get_categories {
	table = tt_news_cat
	select {
		pidInList = 123
		where = parent_category = 0
		orderBy = title
	}
	renderObj = COA
	renderObj {
		10 = TEXT
		10.field = uid
		10.dataWrap =

		10.insertData = 1

		20 = TEXT
		20.field = title
		20.wrap = |

	}
}

pidInList muss auf den Sysfolder zeigen, der alle Kategorien beinhaltet.

where=parent_category=0 gibt an, welche Unterkategorien angezeigt werden sollen; in diesem Fall würden die Oberkategorien ausgegeben werden

HTML-Code generieren

Die einzelnen Ausklappboxen werden nun mit Hilfe von <select name=”source” size=”1″><option … erzeugt. Die option-Tags werden durch das TypoScript von oben generiert. Wenn man TemplaVolia nutzt, muss man ein FCE erzeugen und dann das Typoscript auf die entsprechenden HTML-Tags mappen.

lib.news_filter = COA
lib.news_filter {
	10 = TEXT
	10.value =

	20 = TEXT
	20.value = Thema:
	30 = TEXT
	30.value =

	30 < get_categories
	40.select.where = parent_category = ##THEMA-ID##
	...
}

Unser Formular wird mittels Javascript-Code abgeschickt, d.h. wir nutzen keinen "submit"-Button. Etwas sauberer wäre die Nutzung von PHP und das normale Absenden der GET-Daten, doch damit wird die Umsetzung gleich um einiges komplexer, da wir uns mehr mit den "Innereien" von Typo3 beschäftigen müssten. Wie genau das Absenden funktioniert, wird im nächsten Teil zu lesen sein. Der HTML-Code des Filters sollte nun wie folgt durch TypoScript erzeugt werden:

    Thema:

...

Im action-Attribut muss die Ziel-Seite stehen, auf der die Ergebnisse angezeigt werden. Beim Klick auf den Button wird die JavaScript-Funktion "filter_news" aufgerufen, die wir im nächsten Teil entwickeln werden.