Ergebnis 1 bis 19 von 19

Thema: Ajax und Contao

  1. #1
    Contao-Fan
    Registriert seit
    16.01.2012.
    Beiträge
    418

    Standard Ajax und Contao

    Guten Abend,

    Ich müsste eine Aufzählung von Firmen ausgeben die beim erreichen des Endes der Seite nachgeladen werden (Ich denke InfniteScroll macht sowas ist jedoch kommerziell nicht kostenlos und daher uninteressant für dieses Projekt)

    Hab nun den ganzen Tag versucht soetwas selbst zu Programmieren und den Die "animation" selbst hab ich nun ... Mir fehlt nur der Ajax Teil. Ich verstehe nicht so ganz wie man diesen Mit contao verbinden.

    Ich will jedes mal wenn etwas passiert (ende der Seite wird erreicht) 5 weitere einträge aus der tl_firma laden und ausgeben.

    Hierfür brauche ich eine erweiterung wie simpleAjax - richtig? Wie würde dann die Syntax aussehen? wo Schreibe ich die Datenbankabfrage rein? (da die Datei ja von SimpleAjax zur verfügung gestellt wird, richtig?)

    Sry bin im moment etwas verwirrt und ich denke ich verstehe nur das Grundprinzip nicht. Wäre sehr dankbar über hilfe.

  2. #2
    Contao-Fan Avatar von Sioweb
    Registriert seit
    12.08.2011.
    Ort
    Düsseldorf
    Beiträge
    405
    User beschenken
    Wunschliste

    Standard

    Ho!

    du brauchst simpleAjax nicht zwingend. Du kannst ja Javascript einfach ein Request an die Index-Route senden, in jQuery z.B.:

    PHP-Code:
    $.ajax({
        
    url'/',
        
    method'GET',
        
    data: {
            
    action'loadMyCompanies',
            
    lastId'Letzte ID die angezeigt wird'
        
    },
        
    success: function(response) {
            
    // do something with response
        
    }
    }) 
    Dann erstellst du dir ein Modul, in der Config fängst du den Request ab:

    PHP-Code:
    if(Input::get('loadMyCompanies') == 1) {
        
    $GLOBALS['TL_HOOKS']['initializeSystem'][] = array('MyCompanies''getCompanies');

    Du erstellst eine Klasse class MyCompanies mit der Methode getCompanies:

    PHP-Code:
    class MyCompanies {
        public function 
    getCompanies(){
            
    $lastId = \Input::get('lastId');
            
    // SQL (SELECT * FROM tablename WHERE id > ? LIMIT 5)
            // Aufbereitung / Foreach / Template
            // echo HTML
            
    die(); // damit Contao nicht weiter lädt :)
        
    }

    Falls du Infos zur Modul-Entwicklung für Contao 3 brauchst, kann dir evt. mein C3 DummyBundle helfen https://github.com/Sioweb/Contao3DummyBundle
    Geändert von Sioweb (13.12.2017 um 07:33 Uhr)
    Grüße Sascha W. @Sioweb
    schadebalken.de | zurück-zu-montag.de
    +++ Programmierer von Change-Lok erfasst worden +++

  3. #3
    Contao-Nutzer
    Registriert seit
    06.11.2009.
    Beiträge
    134

    Standard Response wird direkt im Template ausgegeben

    Hallo Sioweb,

    ich bin etwas ratlos bzgl. Contao und Ajax. Ich habe schon diverse Sachen mit Ajax ohne Contao programmiert, was immer ziemlich simpel funktioniert hat. Mit Contao funktioniert das aber leider nicht so.

    Folgendes Ziel habe ich: Ich habe eine Extension entwickelt, die eine Member-Liste ausgibt. Bei jedem Member-Profil wird ein Link zu einer Website angezeigt. Diese Links sollen für eine Statistik gezählt werden. Bei Klick wird also ein Ajax-Request ausgeführt, der dann einen Counter in der Datenbank erhöht. Die aktuelle Zahl soll dann eigentlich per Ajax zurückgeliefert werden, einfach per echo.
    Leider wird aber der Counter nicht an Ajax zurückgegeben, sondern einfach im Template ausgegeben?!

    Ich habe Deine Vorlage dafür verwendet. Wenn ich allerdings z. B. das "die()" im PHP-Code angebe, wird das Template gar nicht erst ausgegeben, die Seite bleibt weiß. Wenn ich den Counter per "echo $counter" zurückliefern will, wird er einfach im Template ausgegeben, Ajax liefert eine "Fail".

    Ich hatte mir dann ein anderes Beispiel als Vorlage genommen: https://blog.axxg.de/einfuehrung-aja...art/#more-2241. Das Beispiel ohne Contao umgesetzt funktioniert einwandfrei. In Contao eingebaut wieder dasselbe Problem. Der Response wird einfach ausgegeben.

    Wo ist da der Denkfehler, bzw. wie gibt man die Werte innerhab eines Contao-Templates an Ajax zurück?

    Würde mir sehr weiterhelfen. Danke schon mal!

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

    Standard

    Wäre für diesen Zweck nicht bspw. bugbuster/contao-visitors-bundle besser geeignet?

  5. #5
    Contao-Nutzer
    Registriert seit
    06.11.2009.
    Beiträge
    134

    Standard

    Zitat Zitat von Spooky Beitrag anzeigen
    Wäre für diesen Zweck nicht bspw. bugbuster/contao-visitors-bundle besser geeignet?
    Nicht wirklich. Ich möchte ja nicht die Besucher der Website zählen, sondern die Klicks auf externe Links. Wie gesagt, ich habe das außerhalb von Contao schon x-mal gemacht und bin mit Ajax im Prinzip gut vertraut. Aber igendwie funktioniert das bei Contao offenbar ganz anders.

    Es handelt sich übrigens um einen Contao 3 Extension (system/modules) innerhalb von Contao 4, was im Grunde auch immer problemlos funktioniert. Hatte noch keine Zeit, mich in die neuen Gegebenheiten der Extension-Entwicklung für Contao 4 einzuarbeiten, ist ja doch so einiges anders.

    Interessant ist ja übrigens, dass der Ajax-Call komplett ausgeführt wird inkl. Schreiben in die Datenbank etc. Nur der Response kommt nicht zurück?! Das heißt, das Routing funktioniert mit dem Hook etc., nur die Rückgabe kriege ich nicht, die wird einfach auf der Website als Text ausgegeben.

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

    Standard

    Ohne deinen Code und Link zu kennen, kann ich nicht helfen.

  7. #7
    Contao-Nutzer
    Registriert seit
    06.11.2009.
    Beiträge
    134

    Standard

    Zitat Zitat von Spooky Beitrag anzeigen
    Ohne deinen Code und Link zu kennen, kann ich nicht helfen.
    Ich hab den Code mal auf das Nötigste zusammengedampft. Der Result-Code wird einfach auf der Website angezeigt. ajax.fail und ajax.always werden in der Console ausgegeben.

    Template MemberProfileDetails.html5
    Code:
    <script>
    	function ajax_website_clicks(member_id)
    	{
    		$.ajax(
                           {
    			  url: '/',
    			  method: 'POST',
    			  data:
                              {
    				action: 'ajaxIncWebsiteClicks',
    				memberId: member_id
    			  },
    			  success: function(response)
    			  {
    				console.log(response);
    		          }
    		}).done
    		(
    			function ()
    			{
    				console.log('SUCCESS');
    			}
    		).fail
    		(
    			function (msg)
    			{
    				console.log('FAIL');
    			}
    		).always
    		(
    			function (msg)
    			{
    				console.log('ALWAYS');
    			}
    		);
    
    	}// end ajax_website_clicks()
    </script>
    config.php
    PHP-Code:
    <?php
    $GLOBALS
    ['TL_HOOKS']['initializeSystem'][] = array('classVerzeichnisStatistik''funcIncWebsiteClicks');
    ?>
    classVerzeichnisStatistik.php
    PHP-Code:
    class classVerzeichnisStatistik
    {
        public function 
    funcIncWebsiteClicks()
        {
            
    $member_id = \Input::post('memberId');
            if(
    $member_id)
            {
                       
    // DB-Operationen ... funktioniert.
                    
    }

                    
    // Ajax Result-Dummy
            
    $result = Array("ergebnis","<div class='ajax_output'>Test</div>");
            echo 
    json_encode($result);
        }
    // end funcIncWebsiteClicks()
    }// end classVerzeichnisStatistik 

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

    Standard

    Zitat Zitat von Sitting Bull Beitrag anzeigen
    ajax.fail und ajax.always werden in der Console ausgegeben.
    Dann sieh' dir doch einfach in der Entwicklerkonsole des Browsers an, was schief läuft.

    Was mir auffällit: du möchtest einen POST Request machen, schickst aber keinen Request Token mit. Sofern du den Request Token Check nicht deaktiviert hast, wird dir Contao hier einen Fehler werfen (und das solltest du eben in der Entwicklerkonsole des Browsers sehen).

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

    Standard

    Zitat Zitat von Sitting Bull Beitrag anzeigen
    classVerzeichnisStatistik.php
    PHP-Code:
    class classVerzeichnisStatistik
    {
        public function 
    funcIncWebsiteClicks()
        {
            
    $member_id = \Input::post('memberId');
            if(
    $member_id)
            {
                       
    // DB-Operationen ... funktioniert.
                    
    }

                    
    // Ajax Result-Dummy
            
    $result = Array("ergebnis","<div class='ajax_output'>Test</div>");
            echo 
    json_encode($result);
        }
    // end funcIncWebsiteClicks()
    }// end classVerzeichnisStatistik 
    So sendet man keinen Response.

    Das wäre eher so:
    PHP-Code:
    (new JsonResponse($result))->send();
    exit; 

    Besser wäre jedoch, wenn du eine eigene Route für deine AJAX Operation machst (es sei denn du benötigst den Front End Context der jeweiligen Seite).

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

    Standard

    Zitat Zitat von Sitting Bull Beitrag anzeigen
    config.php
    PHP-Code:
    <?php
    $GLOBALS
    ['TL_HOOKS']['initializeSystem'][] = array('classVerzeichnisStatistik''funcIncWebsiteClicks');
    ?>
    Halte dich an PSR-12. Einen schließenden PHP Tag solltest du in PHP Dateien nicht machen.

  11. #11
    Contao-Nutzer
    Registriert seit
    06.11.2009.
    Beiträge
    134

    Standard

    Zitat Zitat von Spooky Beitrag anzeigen
    So sendet man keinen Response.

    Das wäre eher so:
    PHP-Code:
    (new JsonResponse($result))->send();
    exit; 
    Das erzeugt bei mir folgende Ausgabe auf dem Screen. Die Contao-Seite wird gar nicht geladen, nur JSON-Output?!
    Code:
    1: "ergebnis"
    2: "<div class='ajax_output'>Test</div>"

    Besser wäre jedoch, wenn du eine eigene Route für deine AJAX Operation machst (es sei denn du benötigst den Front End Context der jeweiligen Seite).
    Das mit den Routen verstehe ich eben noch nicht, keine Ahnung wie das geht ;-(

  12. #12
    Contao-Nutzer
    Registriert seit
    06.11.2009.
    Beiträge
    134

    Standard Keine Fehler in der Konsole

    Zitat Zitat von Spooky Beitrag anzeigen
    Dann sieh' dir doch einfach in der Entwicklerkonsole des Browsers an, was schief läuft.
    In der Konsole werden nur "FAIL" und "ALWAYS" ausgegeben, sonst nichts.

    Zitat Zitat von Spooky Beitrag anzeigen
    Was mir auffällit: du möchtest einen POST Request machen, schickst aber keinen Request Token mit. Sofern du den Request Token Check nicht deaktiviert hast, wird dir Contao hier einen Fehler werfen (und das solltest du eben in der Entwicklerkonsole des Browsers sehen).
    Wie schickt man ein Requets Token? Habe ich bisher nie bei einer Extension gebraucht.

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

    Standard

    Ich meine nicht die Konsole sondern den Netzwerk Tab der Developer Tools deines Browsers.

    Request Tokens musst du auch in Contao 3 für POST Requests mit schicken.

  14. #14
    Contao-Nutzer
    Registriert seit
    06.11.2009.
    Beiträge
    134

    Standard

    [QUOTE=Spooky;516620]Ich meine nicht die Konsole sondern den Netzwerk Tab der Developer Tools deines Browsers.

    Netzwerk-Tab sagt:

    Code:
    Status: 301
    Methode: GET (habe ich von POST auf GET umgestellt, dann brauche ich kein Token, oder?)
    Datei: /?action=ajaxIncWebsiteClicks&memberId=6
    Ursprung: xhr
    Typ: html
    
    Status: 302
    Methode: GET (habe ich von POST auf GET umgestellt, dann brauche ich kein Token, oder?)
    Datei: /de/?action=ajaxIncWebsiteClicks&memberId=6
    Ursprung: xhr
    Typ: html
    Sieht aus meiner Sicht alles perfekt aus?!

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

    Standard

    Nein . Du kannst außerdem noch mehr analysieren im Netzwerk Tab der Developer Konsole deines Browsers. Du kannst dir dort alle Request Header sowie alle Response Header ansehen und auch den tatsächlichen Response Body.

    Deine Methode mit dem initializeSystem Hook funktioniert nicht (zumindest nicht ohne weiteres), vor allem nicht in neueren Contao Versionen. Der initializeSystem Hook ist zu spät - Contao führt vorher schon eigenes, dynamisches Routing aus und redirected die URL daher bspw. auf /de/ in deinem Fall. Und dort passiert dann aus irgend einem Grund zusätzlich noch ein 302 Redirect.

    Wie gesagt, du solltest lieber eine Action mit Route verwenden.

    » https://docs.contao.org/dev/getting-...g-development/

  16. #16
    Contao-Nutzer
    Registriert seit
    06.11.2009.
    Beiträge
    134

    Standard

    Zitat Zitat von Spooky Beitrag anzeigen
    Nein . Du kannst außerdem noch mehr analysieren im Netzwerk Tab der Developer Konsole deines Browsers. Du kannst dir dort alle Request Header sowie alle Response Header ansehen und auch den tatsächlichen Response Body.
    Anfrage Header:
    User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:71.0) Gecko/20100101 Firefox/71.0
    Accept: */*
    Accept-Language: de,en-US;q=0.7,en;q=0.3
    Accept-Encoding: gzip, deflate, br
    X-Requested-With: XMLHttpRequest
    Referer: https://.../de/profile-details.html?id=6&cn=SCGFXYUTAP6
    DNT: 1
    Connection: keep-alive
    Cookie: cookieconsent_status=dismiss; csrf_https-contao_csrf_token=uEtlOBmxjc0JLTj2kvarloxCqBx13FwQ DM8tPbpYgTI
    Antwort Header:
    HTTP/2.0 302 Found
    date: Sat, 21 Dec 2019 15:27:39 GMT
    server: Apache
    x-ajax-location: https://.../de/welcome.html
    cache-control: private
    x-powered-by: PHP/7.3.13
    referrer-policy: no-referrer-when-downgrade, strict-origin-when-cross-origin
    contao-cache: miss
    content-encoding: gzip
    vary: Accept-Encoding
    cache-control: max-age=500
    expires: Sat, 21 Dec 2019 15:35:59 GMT
    content-type: text/html; charset=UTF-8
    X-Firefox-Spdy: h2
    Deine Methode mit dem initializeSystem Hook funktioniert nicht (zumindest nicht ohne weiteres), vor allem nicht in neueren Contao Versionen. Der initializeSystem Hook ist zu spät - Contao führt vorher schon eigenes, dynamisches Routing aus und redirected die URL daher bspw. auf /de/ in deinem Fall. Und dort passiert dann aus irgend einem Grund zusätzlich noch ein 302 Redirect.

    Wie gesagt, du solltest lieber eine Action mit Route verwenden.

    » https://docs.contao.org/dev/getting-...g-development/[/QUOTE]

    OK, werde ich mal studieren.

    Mal ne andere Frage: Was nimmst Du für eine kleine Basis-Extension, die einfach nur einen Ajax-Request sendet und den Response auswertet? Würde ich Dir gern in Auftrag geben, könnte ich sicher öfter gebrauchen. Sollte einfach in system/modules eingespielt werden können.

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

    Standard

    system/modules ist deprecated und für sowas brauchst du keine Extension. Einfach nur eine Route.

  18. #18
    Contao-Nutzer
    Registriert seit
    06.11.2009.
    Beiträge
    134

    Standard

    Zitat Zitat von Spooky Beitrag anzeigen
    system/modules ist deprecated und für sowas brauchst du keine Extension. Einfach nur eine Route.
    Ja, das ist natürlich nicht der Königsweg, würde mich aber erst einmal weiterbringen. Außerdem soll die Extension ja langfristig einiges mehr machen. Ich weiß nur auch nach endlosen Recherchen nicht, wie man da ran geht.

    1. Keine Ahnung, wie das mit den Routen funktioniert.
    2. Keine Ahnung wie man eine COntao 4 Extension baut. Habe gefühlt schon Wochen damit verbracht, das herauszufinden. Leider findet man immer nur Bruchstücke, bei denen immer entscheidende Infos fehlen.
    3. Kann man eine Contao 4 Extension überhaupt ohne composer etc. ins System einspielen, so wie das bei Contao 3 der Fall war? Ich habe nicht überall composer-Zugang. In Contao 3 ging das eben einfach durch Einspielen ins system/modues Verzeichnis, dann ggf. install aufrufen, fertig. So bräuchte ich das möglichst auch für Contao 4?!
    4. Gibt es irgendwo ein möglichst lückenloses Schritt-für-Schritt-Tutorial, wie man eine Contao 4 Extension für den Eigengebrauch (ohne Git etc.) entwickeln und einbinden kann?
    5. Existiert vielleicht irgendwo eine kleine Basis-Extension, auf der man seine eigenen Extensions aufbauen kann?

    Wäre dankbar für alle Hinweise, die zur Ergreifung des Tätes führen ;-)

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

    Standard

    Hast du dir die Dokumentation schon angesehen?

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
  •