Contao-Camp 2024
Ergebnis 1 bis 12 von 12

Thema: Mit contao-ajax_reload_element Content Elemente per Ajax laden

  1. #1
    Contao-Fan Avatar von dirksche
    Registriert seit
    05.08.2009.
    Ort
    Grosslittgen
    Beiträge
    641

    Standard Mit contao-ajax_reload_element Content Elemente per Ajax laden

    Hallo liebe Community,

    ich teste gerade mit Contao 4.4 die Erweiterung contao-ajax_reload_element. Ich schaffe es allerdings nicht, den Inhalt eines Inhaltselements per Klick nachzuladen. Könnt ihr mir einen Tipp geben?
    Mein Script sieht derzeit so aus:

    Code:
    <script>
        $("#myBtn").click(function (event) {
    
            event.preventDefault();
            
            $.ajax({
                method: 'POST',
                url: location.href,
                data: {
                    ajax_reload_element: element.attr('data-ajax-reload-element'),
                    element: 'ce::88',
                    page: <?= $GLOBALS['objPage']->id ?>
                }
            })
    		.done(function (response, status, xhr) {
                    if ('ok' === response.status) {
                        // Replace the DOM
                        $('.tnb').replaceWith(response.html);
                    }
                    else {
                        // Reload the page as fallback
                        location.reload();
                    }
                });
        });
    </script>
    Also mit Klick auf den Button (#myBtn) soll der Inhalt des Inhaltselements mit der ID 88 in das DIV mit der Klasse tnb geladen werden.

    Grüße,
    Dirk

  2. #2
    Contao-Fan
    Registriert seit
    27.06.2010.
    Beiträge
    539

    Standard

    Hallo dirksche,

    1. Die beiden Parameter
    Code:
    element: 'ce::88', page: <?= $GLOBALS['objPage']->id ?>
    kannst du löschen, die werden nicht mehr verwenden.
    2.
    Code:
    // The data- attribute is set automatically
                    ajax_reload_element: element.attr('data-ajax-reload-element')
    Hier sollte dann
    Code:
    ajax_reload_element: 'ce::88'
    setehen
    3. Schaue, dass bei dem Content Element mit der ID 88 das Häkchen "allowAjaxRelaod" gesetzt ist (bzw. schau in der Datenbank nach)
    4. wenn du nun JavaScript-Probleme bekommst, kannst du die debuggen, in dem du in den Browser-Dev-Tools hier https://github.com/richardhj/contao-...ad-form.js#L31 und hier https://github.com/richardhj/contao-...ad-form.js#L47 einen Breakpoint setzt und dir die Response/den Status-Code anschaust.

  3. #3
    Contao-Fan Avatar von dirksche
    Registriert seit
    05.08.2009.
    Ort
    Grosslittgen
    Beiträge
    641

    Standard

    Hi Richard,

    vielen Dank für die Hilfe. Hat nun funktioniert :-)

    Grüße,
    Dirk

  4. #4
    Contao-Nutzer Avatar von Kahru
    Registriert seit
    20.06.2009.
    Ort
    Nordschwarzwald
    Beiträge
    200
    Partner-ID
    2067

    Standard

    Hallo

    ich krame das Thema mal wieder hinten vor denn ich benötige das als Denkanstoss für ein internes 3.5-Projekt das mit simlpeajax gemacht war.

    Wenn ich mir Richards Bundle via Manager installiere funktioniert das Ajax wie gewünscht. Nehme ich das Projekt lokal auf src und will das händisch in die Managed einbinden dann funktioniert alles bis zum Aufruf des Ajax im Javascript. Das Ajax wird dann nicht ausgeführt. Dito passiert bei meinem eigenen Ajax-Projekt ... Hat da jemand einen Denkanstoss für mich woran das liegen könnte?

    Bernard

  5. #5
    Community-Moderator
    Wandelndes Contao-Lexikon
    Avatar von Spooky
    Registriert seit
    12.04.2012.
    Ort
    Scotland
    Beiträge
    33.896
    Partner-ID
    10107

    Standard

    Was genau meinst du mit "das AJAX wird nicht ausgeführt"? Wird das JavaScript tatsächlich nicht ausgeführt? Dann musst du dein JavaScript debuggen. Wird der Request abgesetzt, aber es kommt nicht der erwartete Response? Dann musst du genauere Angaben zum Response machen.

  6. #6
    Contao-Nutzer Avatar von Kahru
    Registriert seit
    20.06.2009.
    Ort
    Nordschwarzwald
    Beiträge
    200
    Partner-ID
    2067

    Standard

    Hi Spooky,

    ich habe das Script von dirk etwas ergänzt zum Testen

    Code:
    <script>
        $("#myBtn").click(function (event) {
    
            event.preventDefault();
            alert("inside onclick");
            
            $.ajax({
                method: 'POST',
                url: location.href,
                data: {
                	ajax_reload_element: 'ce::2'
                }
            })
    		.done(function (response, status, xhr) {
    			    alert("done");
                    if ('ok' === response.status) {
                        // Replace the DOM
                        alert("ok");
                        $('.tnb').replaceWith(response.html);
                    }
                    else {
                        // Reload the page as fallback
                        alert("fallback");
                        location.reload();
                    }
                });
        });
    </script>
    Am 1 Alert komme ich vorbei. Die beiden anderen werden nicht aufgefrufen. Also würde er lokal das $.ajax nicht ausführen. Also irgendwie verwirrt mich das Ganze noch

  7. #7
    Community-Moderator
    Wandelndes Contao-Lexikon
    Avatar von Spooky
    Registriert seit
    12.04.2012.
    Ort
    Scotland
    Beiträge
    33.896
    Partner-ID
    10107

    Standard

    Die anderen Alerts würden ja nur kommen, wenn der Request erfolgreich ist. Benutze den Netzwerk Tab der Dev Tools.

  8. #8
    Contao-Nutzer Avatar von Kahru
    Registriert seit
    20.06.2009.
    Ort
    Nordschwarzwald
    Beiträge
    200
    Partner-ID
    2067

    Standard

    DevTools wirft auf der lokal installierten Extension contao-ajax_reload_element einen 500er Fehler. Die andere via Manager installierte macht das nicht.

    Zur Info: Ich benutze für den Test 2 frisch installierte 4.4er Versionen lokal unter Xampp. Die sind bis auf 3 Testartikel völlig nackt.

    und Edit sagt: Wenn ich ein .fail ins Ajax einfüge dann kommt undefined. Die Class scheint aber korrekt da zu sein

  9. #9
    Contao-Nutzer
    Registriert seit
    05.11.2015.
    Beiträge
    46

    Standard contao-ajax_reload_element -> Postvar ausgeben

    gibt es auch die Möglichkeit im Contentelement welches ich nachlade die Postvariable X auszulesen?

    Ich habe es mit dieser Erweiterung geschafft ein Textelement nachzuladen. Ich möchte aber gerne für ein Projekt Kommentare eines Nutzers nachladen. Je nachdem welche ID ich per Post dem Ajaxrequest mitgebe sollen dann die Kommentare ausgegeben werden.
    Leider ist es mir nicht gelungen im ce_text template welches nachgeladen wurde die Postvariable auszugeben.

    //echo \Input:ost('test');

    Eine weitere Idee war es nun das Absenden des Ajax-Formulars per Hook abzufangen und die Kommentare über den Hook zu laden.

  10. #10
    Contao-Nutzer Avatar von Kahru
    Registriert seit
    20.06.2009.
    Ort
    Nordschwarzwald
    Beiträge
    200
    Partner-ID
    2067

    Standard

    Ich antworte erst mal auf mein eigenes Problem das mittlerweile gelöst ist:
    Also in C4.4 muss die ContaoManagerPlugin.php bei privaten Bundles zwingend in das Verzeichnis {root}/app damit er die Route korrekt einbindet. Ich hatte für "normale" Bundels ohne Routen bisher aus Ordnungsgründen in {root}/src/ContaoManager/ abgelegt.

    @iosis101: Klar geht das. Du musst in Deinem Controller-Modul halt die Daten der Datenbank nachladen und das Result via JsonResponse und send zurückgeben
    Geändert von Kahru (08.11.2019 um 16:48 Uhr)

  11. #11
    Contao-Nutzer
    Registriert seit
    05.11.2015.
    Beiträge
    46

    Standard

    Um ehrlich zu sein, weiß ich nicht warum ich etwas in einem Controller Modul schreiben muss. Ich habe damit noch nie gearbeitet. Ich suche seit Tagen nach einem guten Tutorial zum Thema ajax: Daten nachladen in C4. Gibt es da was, was ich übersehe?

  12. #12
    Contao-Nutzer Avatar von Kahru
    Registriert seit
    20.06.2009.
    Ort
    Nordschwarzwald
    Beiträge
    200
    Partner-ID
    2067

    Standard

    Doku ist kaum zu finden. Ich hab mir auf Github ein paar Extensions bzw. Versuche angesehen und die als private Bundles nachvollzogen. Meine Extension ist hauptsächlich abgeleitet aus contao-ajax_reload_element und dem (ja leider abgekündigten) contao-simple-ajax

Aktive Benutzer

Aktive Benutzer

Aktive Benutzer in diesem Thema: 1 (Registrierte Benutzer: 0, Gäste: 1)

Lesezeichen

Lesezeichen

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •