[TYPO3-german] Ajax handling
Dr Dieter Porth
typo3 at mobger.de
Tue Jul 21 21:04:51 CEST 2015
Am 21.7.2015 um 09:19 schrieb Benjamin Giesbrecht:
> Hallo Dieter,
>
> Danke für deine ausführliche Antwort. Ich habe gestern noch relativ
> lange nach einer Lösung gesucht. Hier die Ergebnisse und offenen Fragen.
>
> Mein Wunsch "Protokoll". Könnte ja auch mit XML Aufgebaut sein, spielt
> aus meiner Sicht keine Rolle man Wrapped ja einfach den HTML-Output
> mit einer Struktur.
>
> {
> "config": {
> "targetSelector":".container",
> "referrer":"index.php?id=2",
> "backendLayout":"Basic"
> "weitereParameter":"fooBar"
> },
> "content":"<html>der angeforderte Teil der Website.</html>"
> }
>
> Mittels stdWrap.postUserFunc = AjaxTools->pageToJson binde ich eine
> PHP Methode ein, welche die Config um den HTML Content erstellt und
> das Ganze dann mit json_encode rendert.
> So weit so gut. Das Problem ist jetzt aber, dass postUserFunc
> anscheinend vor dem Ende des PageRenderers ausgeführt wird. Konkret
> heisst das, dass meine Fluid-Templates zwar von der pageToJson Methode
> bearbeitet werden, nicht aber die auf der Seite enthaltenen CE's
> welche ein Plugin enthalten. Diese werden bekanntlich beim Rendern nur
> markiert und später eingebunden. Ich finde einfach keine Möglichkeit
> nach all diesen Prozessen einzugreifen. Der PageRenderer hat leider
> keine Hooks an dieser Stelle.
> Wie baust due dir deine XML Struktur zusammen? Oder habe ich da was
> nicht kapiert? _______________________________________________
> TYPO3-german mailing list
> TYPO3-german at lists.typo3.org
> http://lists.typo3.org/cgi-bin/mailman/listinfo/typo3-german
Hallo Benjamin,
Ich weiß nicht genau, was du genau an deiner Struktur brauchst.
Mein Ajax-Template wird wie eine normale Seite gerendert, nur dass halt
beim aufrufenden Link der Get-Parameter &type= {Wert aus
$root.config.listener.newPage.content} dranhängen muss. Dies mache ich
per jQuery, aber man kann dies natürlich auch von Typo3 über Typolink
erledigen lassen, um dann mit REALURL sogar noch sprechende Links
generieren zu lassen. Es wird automatich der Content der jeweils
verlinkte Seite per AJAX zurückgeschickt.
# AJAX-Zugriffe auf das Inhaltselement
#=================================================
lib.ajax.content.styles.content.get = COA
lib.ajax.content.styles.content.get {
10 < lib.styles.content.get
10.stdWrap.replacement {
10 {
search = ![CDATA[
replace = !{CDATA{
}
12 {
search = ]]
replace = }CDATA}
}
}
stdWrap.wrap = <![CDATA[|]]>
}
....
ajaxContent = PAGE
ajaxContent {
# $root.config.listener.newPage.content = 1692
typeNum = {$root.config.listener.newPage.content}
# Configuration
config {
# Content type header
#doctype = none
doctype = xhtml_11
# Disable standard header
disableAllHeaderCode = 1
# Dont convert any tags into xhtml
#xhtml_cleaning = none
# Verhindere überflüssige Angaben
disableCharsetHeader = 1
# Additional headers
additionalHeaders = Content-Type: application/xml
# verhindere Ausgabe von parseTime
debug = 0
}
10 = FLUIDTEMPLATE
10 {
layoutRootPath = fileadmin/Resources/Private/Layouts/
partialRootPath = fileadmin/Resources/Private/Partials/
templateRootPath = fileadmin/Resources/Private/Templates/
file = fileadmin/Resources/Private/Templates/DefaultAjax.html
variables {
# default_ajax_html = TEXT
# default_ajax_html.value = Hallo Welt
# Aufruf con
default_ajax_html < lib.ajax.content.styles.content.get
default_ajax_css < lib.ajax.content.css
default_ajax_javascript < lib.ajax.content.javascript
default_ajax_parameter < lib.ajax.content.parameter
}
}
}
HTML-Template
<f:layout name="DefaultAjax" />
<f:section name="default.ajax.html">
<htmlcode>{default_ajax_html}</htmlcode>
</f:section>
<f:section name="default.ajax.css">
<csscode>{default_ajax_css}</csscode>
</f:section>
<f:section name="default.ajax.javascript">
<javascript>{default_ajax_javascript}</javascript>
</f:section>
<f:section name="default.ajax.parameter">
<parameter>{default_ajax_parameter}</parameter>
</f:section>
HTML-Layout
<?xml version="1.0" encoding="UTF-8"?>
<data>
<f:render section="default.ajax.html" />
<f:render section="default.ajax.css" />
<f:render section="default.ajax.javascript" />
<f:render section="default.ajax.parameter" />
</data>
Das aufrufende und empfangende JavaScript muss nach dem Aufbröseln der
XML-Struktur noch das CDATA wieder demaskieren. (jQuery.get...)
Natürlich kann man sich auch komplexere Fälle vorstellen, aber solche
Fälle kann man wieder auf diese Defaultstruktur reduzieren.
Eigentlich tricky wird es erst, wenn man alles weiter dynamisieren
will, indem man statt statischer Daden generische Daten übergibt. Ich
denke, die Kombination AngularJS und TYPO3 könnte in Zukunft fruchtbar
werden - insbesondere wegen des Two-Way-Data-Binding von AngularJS.
Bislang fehlt mir aber leider die Zeit, um mich mit dem Entwurf einer
Sprachlogik zu beschäftigen, mit welcher man ein Browser via AJAX mit
TYPO3 auf generischer Basis kommunizieren könnte. Mir ist derzeit die
Entwicklung meines Textgenerators für chemische Versuchsbeschreibungen
wichtiger, der per TYPO3 aus Formulareingaben zu einem chemischen
Experiment einen lesbarer Text baut und zukünftig vielleicht sogar eine
experiment-orientierte Reaktionsgleichung konstruiert. Der Vorteil des
Generators liegt dabei in der Tasache, dass die gesamte chemische
Reaktion nach der Eingaben in einem relationalen Datenbankmodell
gespeichert ist und so erstmalig statistische Untersuchungen zum
Einfluss der Reaktionsbedingungen auf die Ausbeute von chemischen
Reaktionen ermöglichen könnte. Gleichzeitig könnte das Modell eine
sinnvolle Ergänzung zu den Stoff-basierten Reaktionsdatenbanken der
Chemiker sein und die Arbeit im Labor erleichtern
Dieter
--
Dr. Dieter Porth -
Mein kleines TYPO3-Labor: http://www.mobger.de/
More information about the TYPO3-german
mailing list