Zusammenspiel php/JS bei Parameterübergabe von php zur JS Funktion
bearbeitet von
Lieber Andreas,
> dass mein javascript nicht wegen Sonderzeichen den "Scriptbetrieb" einstellt,
ist das ein Problem mit der Kodierung, also Sonderzeichen im Sinne von ÄÖÜß usw., oder von passenden Anführungszeichen (doppelte und einfache)?
> ~~~ PHP
> echo ("
> <INPUT TYPE=submit VALUE=\"test\" onclick=\"einsetzen(`".aus_php_escape($bemerkung)."`)\">
> ");
> ~~~
Das sieht einfach falsch aus, wie Dir meine Vorposter auch schon zu verstehen gegeben haben. Warum kannst Du den Wert nicht so notieren, dass er von JavaScript ohne zusätzliches Escaping verwendet werden kann? Ist das der Kern Deiner Frage?
Beim Programmieren müssen wir beachten, wenn es [Kontextwechsel](https://wiki.selfhtml.org/wiki/Programmiertechnik/Kontextwechsel) gibt. Dich interessiert vor allem der Zusammenhang [Programmcode und Daten](https://wiki.selfhtml.org/wiki/Programmiertechnik/Kontextwechsel#Programmcode_und_Daten).
Dein Beispiel oben forme ich ein Bisschen um:
~~~ PHP
printf(
'<button name="irgendwas" value="test" onclick="einsetzen(\'%s\')">',
htmlspecialchars($bemerkung)
);
~~~
Der Inhalt von `$bemerkung`{:.language-php} sollte nun für JavaScript direkt lesbar sein. Der Platzhalter `%s` wird mit dem Rückgabewert der Funktion `htmlspecialchars()`{:.language-php} befüllt, die den Wert von `$bemerkung`{:.language-php} entsprechend verarbeitet.
Wenn Du nur einen *quick fix*{:@en} gesucht hast, dann so weit so schlecht. Besser wäre, was man Dir meine Vorposter auch schon empfohlen haben, dass Du den Wert in ein passendes [`data-*`{:.language-html}-Attribut](https://wiki.selfhtml.org/wiki/HTML/Attribute/data-*) schreibst, weil dann die doppelte Maskierung mit den Anführungszeichen nicht sein muss:
~~~ PHP
printf('
<input
data-nimmdas="%s"
name="irgendwas"
value="test"
onclick="einsetzen(this.dataset.nimmdas)"
>
',
htmlspecialchars($bemerkung)
);
~~~
Es stellt sich aber allen Ernstes die Frage, warum diese Sache mit JavaScript in dieser Form überhaupt sein muss. Das riecht sehr stark danach, dass man sich das *wesentlich* erleichtern kann, indem man das JavaScript allgemeiner baut und z.B. mit data-Attributen die Verarbeitung durch JavaScript steuert:
~~~ PHP
printf('
<input
data-nimmdas="%s"
data-zielfeld="irgendwas-anderes"
name="irgendwas"
value="test"
>
',
htmlspecialchars($bemerkung)
);
~~~
~~~ JavaScript
const myForm = document.querySelector("form"); // eventuell eine ID verwenden?
form.addEventListener("click", event => {
if (event.target.tagName
&& "BUTTON" == event.target.tagName
&& event.target.hasAttribute("data-nimmdas")
&& event.target.hasAttribute("data-zielfeld")
) {
const button = event.target;
const zielfeld = form.querySelector('[name="' + button.dataset.zielfeld + '"]');
// input feld vorbelegen
if (zielfeld) {
zielfeld.value = button.dataset.nimmdas;
}
}
});
~~~
Aber dazu müsstest Du ein echtes Beispiel zeigen, gerne mit Fake-Daten, bei dem man die tatsächliche Mechanik verstehen kann.
Liebe Grüße
Felix Riesterer