Zum Inhalt springen

Ajax Aufruf endet auf einer Seite mit dem Request Inhalt

Erstellt am 10. Oktober 2018 · 1 Antwort · letzte Antwort am 11. Oktober 2018

Tags: Extbase, JavaScript & AJAX, TYPO3 7, Frage

satan_jim_knopf ·

Hallo,

ich bin am verzweifel. Bei meiner Ajax Funktion habe ich mich an das Buch von Herrn Lobacher gehalten. Jedoch wenn ich meine Formulardaten abschicke, dann lande ich ständig auf einer leere Seite mit dem Request Inhalt als JSON und ich verstehe einfach nicht warum? Könnt ihr mit weiterhelfen?

Template:

<h3>Adressen</h3>
<f:form action="schritt2Ajax" controller="Wizard" name="adresse" object="{adresse}">
    <div class="form-group">
        <label>PLZ</label>
        <f:form.textfield property="plz" class="form-control" />
    </div>

    <div class="form-group">
        <label>Stadt</label>
        <f:form.textfield property="stadt" class="form-control" />
    </div>

    <div class="form-group">
        <label>Straße</label>
        <f:form.textfield property="strasse" class="form-control" />
    </div>

    <div class="form-group">
        <label>HSN</label>
        <f:form.textfield property="hausnummer" class="form-control" />
    </div>

    <div class="form-group">
        <label>Zusatz</label>
        <f:form.textfield property="zusatz" class="form-control" />
    </div>

    <f:form.submit value="Erstellen!" class="btn btn-primary" id="adresssubmit" />

</f:form>

<ul class="list-group" id="adressen">
    <f:for each="{adressen}" as="adresse" reverse="TRUE">
        <li class="list-group-item">{adresse.plz}</li>
    </f:for>
</ul>

<script type="text/javascript">
    $(document).ready(function () {
        $('#adresssubmit').click(function () {
            var ajaxURL = '<f:uri.action action="schritt2Ajax" controller="Wizard" pageType="99" />';
            var form = $('form');
            $.post(ajaxURL, form.serialize(), function (response) {
                console.log(response);
                var items = [];
                $.each(response, function (key, val) {
                    items.push('<li class="list-group-item">' + val.plz + '</li>');
                });
                $('#adressen').html(items.reverse().join(''));
                
            });
            return false;
        });
    });
</script>

Controller:

/**
     * @param \DE\Zustimmungsverfahren\Domain\Model\Adresse $adresse
     * @return String
     */
    public function schritt2AjaxAction(
       \DE\Zustimmungsverfahren\Domain\Model\Adresse $adresse = NULL
    ) {
        $vorgang = new \DE\Zustimmungsverfahren\Domain\Model\Vorgang;
        if ($GLOBALS['TSFE']->fe_user->getKey('ses', 'vorgang') && $vorgang == NULL) {
            $vorgang = unserialize($GLOBALS['TSFE']->fe_user->getKey('ses', 'vorgang'));
        }
        if ($adresse == NULL)
            return FALSE;
        $vorgang->addReAdresse($adresse);

        $adressen = $vorgang->getReAdresse();
        
        
        foreach ($adressen as $adresse) {
            $json[1] = array(
                'plz' => $adresse->getPlz(),
                'stadt' => $adresse->getStadt(),
                'strasse' => $adresse->getStrasse(),
                'hausnummer' => $adresse->getHausnummer(),
                'zusatz' => $adresse->getZusatz()
            );            
        }
        return json_encode($json);
        
    }

setup.ts:

ajax = PAGE
ajax {
	typeNum = 99
	config {
		disableAllHeaderCode = 1
		additionalHeaders = Content-type:application/json
		admPanel = 0
		debug = 0
	}
	10 < tt_content.list.20.zustimmungsverfahren_zustimmungsverfahren
}
satan_jim_knopf ·

Okay... Ich hab die Lösung. ^^ Ich war selbst das Problem, denn ich habe vergessen JQuery zu integrieren, damit der Code auch richtig ausgeführt wird.