mailto, Subjekt aus Tabellenzeilen

**louthi** · 14.10.2018, 08:26

Hallo,

ich habe folgende Lösung zu erarbeiten, komme aber nicht richtig weiter.

Ein Kunde hat eine Tabellenliste mit einer Artikel-Nr. in der ersten Spalte. In der letzten Spalte ist ein Link mit der Mailto-Anweisung. Gibt es eine Möglichkeit den Wert aus der 1. Spalte als Subjekt oder Body in das Mail zu übernehmen?

Es müsste aber eine Variabele für Spalte 1 sein, da die Tabelle viele Zeilen hat für entsprechend viele Artikel.

Danke im Voraus!

**MacKP** · 14.10.2018, 09:32

Hallo louthi,
das sind jetzt leider nicht wirklich viele Infos von dir...
Was ist das für eine Tabelle? Mit einem Content-Element erstellt (wäre am besten für so etwas)?
Grundsätzlich sehe ich zwei Möglichkeiten, wenn das Automatisiert passieren soll:
1. per PHP: das Template vom Content Elment anpassen (also ein extra Template für diese Art der Tabelle)
2. per JavaScript: Da würde dann eine ID oder Klasse bei der Tabelle reichen und dann ein extra Template für das JS, was dann (mindestens auf der Seite) eingebunden sien muss

So oder so würdest du das dann so machen:
- Aus der Spalte mit den Artikel-Nr. die Nr. auslesen und dann in bei dem jeweiligen mailto als Subject ergänzen (wie hier als Beispiel: https://www.w3schools.com/tags/tryit...ml_link_mailto)

Ich persönlich finde solche Dinge per PHP etwas besser, da die dann immer Funktionieren (auch wenn JS ausgeschaltet ist), da die aber nicht Zwingend für die Benutzung erforderlich sind, könnte ich mir das auch gut per JS vorstellen. Ist im Grunde dir überlassen, welche Variante du dann umsetzen möchtest. Kommt natürlich auch darauf an, was du besser kannst ;-)

Viele Grüße

PS: wenn du beides nicht kannst, könntest du für so etwas auch in dem Bereich Kleinstaufträge eine Anzeige machen. Sollte nicht sehr lange dauern so etwas (je nach genauem Inhalt der Zellen)

**louthi** · 14.10.2018, 11:29

Danke MacKP für die ausführlichen Infos und deine Zeit. Eine Frage habe ich noch: gäbe es ein Befehl für den Wert der Spalte 1 auszulesen, den suche ich schon die ganze Zeit.

**MacKP** · 14.10.2018, 11:39

Hallo louthi,
kommt darau an. Per PHP ist das natürlich anders als per JS...
Bei JS kommt es dann noch darauf an, ob vanilla JS oder jquery...
jquery könnte zum Beipsiel so aussehen:

Code:

var a = $(this).closest('tr').find('td:first').text();

Das wäre dann erste tr und da dann die erste td (davon den Text). $(this) ist schon die Tabelle vorausgewählt.
Du müsstest das natürlich in eine Schleife packen und dann für jede Zeile durchlaufen (dann ist das z.b. tr:nth-of-type(x)) wobei x hier für die aktuelle Zahl steht, anstelle von closest...
Dann hast du schon mal den Text aus Zelle 1 in a, das kannst du dann anpassen (wenn nötig) und in das mailto (ist ja in td:last) noch einfügen.

Viele Grüße

**louthi** · 14.10.2018, 12:16

Hallo macKP, super, das probiere ich mal aus. Danke und Grüße

**MacKP** · 14.10.2018, 12:35

Ich hab dir mal eben etwas zusammen geschustert (ist ohne jquery):

Code:

<script>
      window.onload = function () {
          let myTable = document.querySelectorAll('.nrInMailto tbody');
          for (let myTables = 0; myTables < myTable.length; myTables++) {
              //console.log(myTable);
              let myTableTrs = myTable[myTables].querySelectorAll('tr');
              //console.log(myTableTrs);
              for (let trs = 0; trs < myTableTrs.length; trs++) {
                  let thisTr = myTableTrs[trs];
                  //console.log(thisTr);
                  let aNr = thisTr.querySelector('td:first-of-type').innerHTML;
                  let mailtoLink = thisTr.querySelector('td:last-of-type a');
                  let mailtoLinkHref = mailtoLink.href;
                  // console.log(aNr, mailtoLink, mailtoLinkHref);
                  mailtoLinkHref += 'Subject=' + aNr;
                  mailtoLink.href = mailtoLinkHref;
              }
          }
      }
  </script>

Die console.log Sachen kannst du auch ganz rausschmeißen. Wenn du die auskommentierst siehst du was sich da gerade tut...
Es wird erst mal nach einer Tabelle mit der Klasse 'nrInMailto' gesucht und das kommt dann in myTable. Kannst du natürlich anpassen an der Stelle.
Sucht jetzt alle Tabllen auf einer Seite mt dieser Klasse heraus (dafür ist dann auch die erste for-Schleife).

Dann werden alle tr in dem tbody genommen und in myTableTrs gespeichert.
Das ist dann ein array was in der for-Schleife durchlaufen wird.

Erst mal zusammen Sammeln, der aktuellen Infos und dann wird im letzten Schritt das aktuelle mailto mit dem Subject und der Nr. aus der ersten Zeile ergänzt. Ist also egal was für ein Mailto schon vorhanden ist. Da musst du natürlich aufpassen, was da schon vorhanden ist.

Ist jetzt nicht das schönste Script, aber sollte zumindest klar machen wie das gehen kann

Viele Grüße

PS: Ich hab das mal als codepen gemacht, damit man sich das einfacher anschauen und anpassen kann: https://codepen.io/MacKP/pen/WaZZRv

**louthi** · 15.10.2018, 12:42

Hallo macKP,

whow, das hat mir schon sehr weitergeholfen! Habe nun das Script in Contao eingebaut, aber es funzt nicht.

Zum Test habe ich Deine Tabelle und den Code mal eingebaut und das funktioniert im FE. Mein Link in der Tabelle aber nicht, ich komme nicht dahinter wo der Fehler liegt.
Hier mal die inoffizielle Seite mit der großen Tabelle und dem Anfragelink: http://www.bender-geib.de/sortimentliste.html. Deine Tabelle ist am Anfang der Seite eingebaut, meine weiter unten

Kannst Du mir bitte auf die Sprünge helfen … Danke schon mal.
Viele Grüße

**MacKP** · 15.10.2018, 13:00

Hallo louthi,
was auffällt: Du hast bei deiner Tabelle natürlich eine andere Klasse...
Da kann das dann natürlich nichts machen.
Du solltest also entweder deine Klasse anpassen oder im JS die Klasse hier anpassen:

Code:

let myTable = document.querySelectorAll('.nrInMailto tbody');

Da steht aktuell .nrInMailto als Klasse. Das dann in deine Klasse umbenennen.

Viele Grüße

Edit: Ich hab auch noch eine Überprüfung eingebaut, falls es keinen Link in der letzten Spalte gibt. Ist jetzt hier enthalten: https://codepen.io/MacKP/pen/WaZZRv
Ich war davon ausgegangen, dass du immer einen Link hast (der dann auch immer ein Mailto Link ist, ansonsten müsste man das auch noch abfangen..).

Edit2:
codepen noch um einen body-Text ergänzt und dann noch das Fehlende ? vor Subject gesetzt. Das hatte ich vergessen...