Ich möchte mit über Java ein Zeichenfeld einbauen, das so entstandene Bild als Variable speichern, auf der nächsten Seite wieder laden und wieder als Bild anzeigen angeben.
Das Zeichenfeld einbauen funktioniert. Das Anzeigen des Bildes bekomme ich bestimmt auch hin, wenn ich die Variable laden könnte.
Also das Problem liegt irgendwo auf dem Weg zwischen Variable speichern und auf der nächsten Seite wieder laden.
Auf der ersten Seite habe ich die interne Variablen Frage mit dem Variablennamen A103_01 angelegt:
Das hier ist die Speicherfunktion des Java Skript von Seite 1, die jedesmal beim setzten eines Strichs ausgeführt wird:
function saveCanvasToVariable() {
const dataURL = canvas.toDataURL('image/png'); // base64 PNG
document.getElementById("A103_01").value = dataURL;}
Die müsste eigentlich funktionieren, denn wenn ich in der Konsole folgenden code eingeben, verändert sich die Länge der Variable:
document.querySelector('input[name="A103_01"]').value.length
Auf der zweiten Seite habe ich diesen PHP Code
prepare_input('A103_01');
und diesen HTML Code
<p>Ihre handschriftliche Eingabe:</p>
<img id="sigPreview" alt="Handschriftliche Eingabe"
style="max-width: 100%; border: 1px solid #000;">
<script>
var dataURL = document.getElementById("A103_01").value;
if (dataURL && dataURL !== "" && dataURL.indexOf("data:image") === 0) {
document.getElementById("sigPreview").src = dataURL;
} else {
document.getElementById("sigPreview").alt = "Kein Bild gefunden.";
}
</script>
Die Konsole gibt mir diesen Fehler aus:
TypeError: null is not an object (evaluating 'document.getElementById("A103_01").value')
Ich nehme deswegen an, dass entweder das Speichern auf Seite 1 oder das Laden auf Seite 2 nicht funktioniert, aber dort komme ich nicht weiter.
Es wäre wunderbar, wenn mir jemand hier helfen könnte.
Dankeschön