Mit AJAX ejs Template aktualisieren

  • Hallo Leute,


    ich bin neu in der Webentwicklung. Seit einigen Wochen habe ich mir viele Tutorials angesehen und diverse kleine Testprojekte umgesetzt. Jetzt habe ich ein Projekt gestartet und nun poppen die die ersten Probleme auf, es war klar dass das kommt. :)


    In dem Projekt arbeite ich mit Node.js, Express, ejs, AJAX.


    Hier meine Frage: Wie kann ich mit einem AJAX request (ich hoffe das Wording passt!?) ein ejs Template aktualisieren?


    Ok, eine einfache HTML Seite kann wie folgt verändern:


    In meinem Template befindet sich einiges an embedded JavaScript und das soll natürlich ausgeführt werden. Irgendwie stehe ich auf dem Schlauch. Wie macht man das am Besten?


    Über eure Unterstützung würde ich nich sehr freuen!


    LG
    Christoph

  • Hallo Stef,


    vielen Dank für die Antwort! Das Problem konnte ich nun lösen. Ich hatte eine falsche Denkweise für den Umgang mit dem Button. Bisher habe ich ausschließlich Applikationen für den Desktop entwickelt und deswegen habe ich mich so auf das Click Event versteift. Dabei war ein Link als Button eine wirklich ganz ganz einfache Lösung, die angeforderte Seite wird nun einfach vom Controller neu gerendert. Ich habe mich stundenlang vergebens damit geplagt. Na ja, ganz vergebens war es nicht, dafür kann ich jetzt auch etwas AJAX/Jquery! :)


    Vielen Dank noch mal!

    Christoph

  • Ich habe das mit einem Bootstrap Button gelöst:


    Code
    1. <a href="/myroute?loadBy=loadAll" class="btn btn-outline-primary load-btn" role="button" aria-pressed="true">
    2. Load All
    3. <svg width="1em" height="1em" viewBox="0 0 16 16" class="bi bi-arrow-clockwise" fill="currentColor"
    4. xmlns="http://www.w3.org/2000/svg">
    5. <path fill-rule="evenodd" d="M8 3a5 5 0 1 0 4.546 2.914.5.5 0 0 1 .908-.417A6 6 0 1 1 8 2v1z" />
    6. <path d="M8 4.466V.534a.25.25 0 0 1 .41-.192l2.36 1.966c.12.1.12.284 0 .384L8.41 4.658A.25.25 0 0 1 8 4.466z" />
    7. </svg>
    8. </a>


    Stef Vielen Dank für die nette Unterstützung! :thumbup: