Pit: Jquery: Formular ausfüllen

Hallo,

ich simuliere mit Jquery einen Klick auf einen Button, der ein zuvor verborgenes (hidden) Formular öffnet. $('#myID').click(); Anschließend würde ich gerne ein paar Formulatwerte eintragen, aber es klappt nicht:

$('#myInputfield').val('Dies ist ein Test');

funktioniert nicht.

Aber auch meine 2. Idee:

if (!empty($_POST['myInputfieldTransfer'])) {
	$myInputfieldValue = $_POST['myInputfieldTransfer'];
}

schlug fehl.

Was ist an den beiden Ideen denn falsch?

Pit

  1. @@Pit

    ich simuliere mit Jquery einen Klick auf einen Button, der ein zuvor verborgenes (hidden) Formular öffnet. $('#myID').click(); Anschließend würde ich gerne ein paar Formulatwerte eintragen, aber es klappt nicht:

    Was immer „es“ ist …

    $('#myInputfield').val('Dies ist ein Test');

    funktioniert nicht.

    … das funktioniert.

    Aber auch meine 2. Idee:

    if (!empty($_POST['myInputfieldTransfer'])) {
    	$myInputfieldValue = $_POST['myInputfieldTransfer'];
    }
    

    schlug fehl.

    Was ist an den beiden Ideen denn falsch?

    Was haben denn die beiden Ideen miteinander zu tun?

    LLAP 🖖

    --
    “When UX doesn’t consider all users, shouldn’t it be known as ‘Some User Experience’ or... SUX? #a11y” —Billy Gregory
    1. Hallo Gunnar,

      Was haben denn die beiden Ideen miteinander zu tun?

      Beide Ideen sollen dazu dienen, ein Formular zu befüllen. Aber wie schon dedlfix geantwortet, hatte ich vergessen zu erwähnen, dass ich das Formular per Jquery load() Funktion nachlade.

      Pit

  2. Tach!

    $('#myInputfield').val('Dies ist ein Test');

    funktioniert nicht.

    Debugging ist die Vorgehensweise, um genau herauszufinden, was das Problem sein könnte.

    Obiges Konstrukt besteht aus zwei Teilen. Der erste Teil ermittelt eine Liste von Elementen, die dem Selektionskriterium entsprechen. Gut, bei einer ID sollte die Liste lediglich aus einem Element bestehen, der Punkt ist aber, dass es eine Ergebnisliste gibt. Diese kann man sich durchaus auch mal anschauen. Setz einen Breakpoint auf die Zeile. Wenn der Code dort angekommen ist, wechsle in den Console-Tab und führ dort $('#myInputfield') aus. Das ergibt irgendein jQuery-Objekt. Aber wenn man sich das genauer anschaut (ausklappen), hat das eine length-Eigenschaft. Diese entspricht der Anzahl der gefundenen Objekts. Steht da eine 1, wird die Selektion geklappt haben. Welche(s) Element(e) selektiert wurde, ist auch in diesem jQuery-Objekt zu erkennen. Bei 0 hast du einen Fehler in deinem Code, dass du was zu selektieren versuchst, das gar nicht da ist.

    Der zweite Teil wird erst dann interessant, wenn der erste die richtigen Elemente gefunden hat. Da gibts aber in dem Fall nichts großartig zu debuggen. Das ist soweit angewendet wie in der Dokumentation beschrieben. Aber der Teil kann nur dann arbeiten, wenn der erste Teil erfolgreich war. Deswegen das Konstrukt auseinandernehmen und einzeln testen. Man kann ja durchaus auch noch längere verkettete Aufrufe notieren.

    Aber auch meine 2. Idee:

    if (!empty($_POST['myInputfieldTransfer'])) {
    	$myInputfieldValue = $_POST['myInputfieldTransfer'];
    }
    

    schlug fehl.

    Wie äußert sich denn das "schlug fehl"? Gab es eine Fehlermeldung? Waren die Werte nicht wie vorgesehen? Wenn letzeres der Fall ist, waren sie im Request zu sehen gewesen? Den kann man sich ja auch in den Entwicklertools in aller Schönheit anschauen (Network-Tab).

    dedlfix.

    1. Hi dedlfix,

      Debugging ist die Vorgehensweise, um genau herauszufinden, was das Problem sein könnte.

      Jaja...

      Setz einen Breakpoint auf die Zeile.

      Das hattest Du mir früher schonmal gesagt. Ich weiß nicht, wie man einen Breakpunkt setzt. kannst Du mir das sagen?

      Zu dem gnazen Problem muß ich sagen, dass ich vergessen hatte, zu erwähnen, dass ich das Formular über Jquery load() nachlade. Das dürfte mal wieder in Richtung meines guten, alten Problems kaufen, eine ID ansprechen zu wollen, die es noch gar nicht gab :-(

      Aber auch meine 2. Idee:

      if (!empty($_POST['myInputfieldTransfer'])) {
      	$myInputfieldValue = $_POST['myInputfieldTransfer'];
      }
      

      schlug fehl.

      Wie äußert sich denn das "schlug fehl"? Gab es eine Fehlermeldung? Waren die Werte nicht wie vorgesehen? Wenn letzeres der Fall ist, waren sie im Request zu sehen gewesen? Den kann man sich ja auch in den Entwicklertools in aller Schönheit anschauen (Network-Tab).

      Der vorgesehene Wert wird nicht ins Inputfeld eingesetzt. Ich denke, dass das daran liegt, dass ich das Formular per load() nachlade. Im REQUEST ist der Wert nicht vorhanden.

      Pit

      1. Tach!

        Debugging ist die Vorgehensweise, um genau herauszufinden, was das Problem sein könnte.

        Jaja...

        Ich weiß, dass du mehr direkte Hilfe erwartet hast, aber die kann ich nicht bieten. Ich bin ja kein Hellseher und muss mich deshalb zu Fuß durch allen Code durchbewegen. Das Problem war auch nicht mithilfe der einen Zeile Code zu sehen. Deswegen kann ich dir nur generell meine Vorgehensweise schildern, um das Problem einzukreisen.

        Setz einen Breakpoint auf die Zeile.

        Das hattest Du mir früher schonmal gesagt. Ich weiß nicht, wie man einen Breakpunkt setzt. kannst Du mir das sagen?

        Du öffnest in den Entwicklertools im Tab Sources (Chrome) oder Debugger (Firefox) die Ressource, in der dein Code steht. Auf die problematische Zeile oder ein paar Zeilen davor klickst du auf den linken Rand, da wo die Zeilennummern stehen. Breakpunkt gesetzt. Der taucht dann auch in der Liste der Breakpoints auf. Lässt sich mit einem weiteren Klick auch wieder entfernen, oder auch über die Liste der Breakpoints.

        Zu dem gnazen Problem muß ich sagen, dass ich vergessen hatte, zu erwähnen, dass ich das Formular über Jquery load() nachlade. Das dürfte mal wieder in Richtung meines guten, alten Problems kaufen, eine ID ansprechen zu wollen, die es noch gar nicht gab :-(

        Möglicherweise. Das kann man auch mithilfe passend gesetzter Breakpoints herausfinden. Du siehst dadurch, ob die Ausführung zu früh, zu spät oder genau richtig an der Stelle vorbeikommt.

        dedlfix.

        1. Hi dedlfix,

          Debugging ist die Vorgehensweise, um genau herauszufinden, was das Problem sein könnte.

          Jaja...

          Ich weiß, dass du mehr direkte Hilfe erwartet hast

          Haalt! Dann hast du mein Post falsch verstanden (oder ich mich falsch ausgedrückt?) Ich fand Deine Antwort richtig, richtig gut! Und ob meiner rudimentären Problem- und Fehlerbeschreibung war das viel mehr als ich hätte erwarten dürfen! Das "Jaja..." war so zu verstehen, dass ich mit "debugging" sicher die Hälfte meiner Zeit, vielleicht auch mehr verbringe. Also eher "zustimmend mit dem Kopf nickend" 😉

          Du öffnest in den Entwicklertools im Tab Sources (Chrome) oder Debugger (Firefox) die Ressource, in der dein Code steht. Auf die problematische Zeile oder ein paar Zeilen davor klickst du auf den linken Rand, da wo die Zeilennummern stehen. Breakpunkt gesetzt. Der taucht dann auch in der Liste der Breakpoints auf. Lässt sich mit einem weiteren Klick auch wieder entfernen, oder auch über die Liste der Breakpoints.

          Werde ich ausprobieren, danke für die Erklärung.

          Zu dem gnazen Problem muß ich sagen, dass ich vergessen hatte, zu erwähnen, dass ich das Formular über Jquery load() nachlade. Das dürfte mal wieder in Richtung meines guten, alten Problems kaufen, eine ID ansprechen zu wollen, die es noch gar nicht gab :-(

          Möglicherweise. Das kann man auch mithilfe passend gesetzter Breakpoints herausfinden. Du siehst dadurch, ob die Ausführung zu früh, zu spät oder genau richtig an der Stelle vorbeikommt.

          Ich kümmere mich gerade darum, wie ich einem js-script ein paar "php-POST-parameter" mitgeben kann. Das dürfte mein Problem klären…

          Pit

          1. Tach!

            Jaja...

            Ich weiß, dass du mehr direkte Hilfe erwartet hast

            Haalt!

            Ich kann da nichts machen. Danke an Brösel, bei jaja muss ich immer an den Meister von Werner denken.

            dedlfix.

            1. Ich kann da nichts machen. Danke an Brösel, bei jaja muss ich immer an den Meister von Werner denken.

              Haha, kennste den auch noch!? 😂 Eckaat... 😉

              Wie gesagt, ich habs anders gemeint 😉

              Pit

  3. @@Pit

    […] aber es klappt nicht:

    […] funktioniert nicht.

    vier Dinge funktionieren nicht. Diese sind: "Funktioniert nicht", synonyme Bezeichnungen wie z.B. "klappt nicht", unabgeschlossene Listen,

    Cheatah 1242

    LLAP 🖖

    --
    “When UX doesn’t consider all users, shouldn’t it be known as ‘Some User Experience’ or... SUX? #a11y” —Billy Gregory
  4. Guten Morgen, Forum,

    ich versuche, eine Variable aus php an JS weiterzugeben, aber anscheinend kommt sie nicht in JS an. Wichtig ist, sie soll in einem externen js-script verfügbar sein. Ich gehe wie folgt vor (auch in genau dieser Reihenfolge im Code):

    php:

    if (!empty($_POST['myTest'])) {
    echo("<script type=\"text/javascript\">var test = ".$_POST['myTest'].";</script>");
    }
    

    HTML:

    <script type="text/javascript" src="js/myjs.js"></script>
    

    JS (in der myjs.js-Datei):

    console.log(test);
    

    Ergebnis: ReferenceError: test is not defined [Weitere Informationen]

    Wie gebe ich der externen js-datei denn eine Variable weiter?

    Pit

    1. Hallo,

      hast du mal einen Blick in den HTML-Quelltext geworfen, ob das Script da auch steht?

      Erfolgt die Zuweisung test = ... vor dem Ausführen von myjs.js?

      Gruß
      Jürgen

      1. Hallo Jürgen,

        danke für Deine Hilfe. Dadurch bin ich auf die Lösung gekommen.

        hast du mal einen Blick in den HTML-Quelltext geworfen, ob das Script da auch steht?

        Es stand dort.

        Erfolgt die Zuweisung test = ... vor dem Ausführen von myjs.js?

        Auch das war der Fall. Der Fehler war diese Zeile:

        echo("<script type=\"text/javascript\">var test = ".$_POST['myTest'].";</script>");

        Die Stringzuweisung an die Variable "test" muß natürlich in Anführungszeichen stehen. Nun wird sie weitergegeben und ich kann mit ihr im js-script arbeiten.

        Pit

    2. Tach!

      ich versuche, eine Variable aus php an JS weiterzugeben, aber anscheinend kommt sie nicht in JS an.

      Lass uns das mal exakter formulieren, um die Vorgänge etwas mehr klarzustellen.

      Javascript interessiert sich nicht für PHP-Variablen. Und PHP kann auch keine Variablen irgendwohin reichen. PHP kann nur den Inhalt einer Variablen in irgendeine Ausgabe schreiben. Wenn in Javascript dieser Wert zur Verfügung stehen soll, dann muss PHP Javascript-Code schreiben. Und der muss auch syntaktisch korrekt sein. Mit anderen Worten: Du möchtest einen Wert, der sich in dem Fall in einer Variable befindet, im Javascript-Teil der Ausgabe zur Verfügung haben.

      Wichtig ist, sie soll in einem externen js-script verfügbar sein.

      Es gibt am Ende keinen Unterschied mehr zwischen eingebundenem oder direkt in der Seite befindlichen Javascript-Code. Ein script-src-Verweis ist letztlich so, als ob der Code an der Stelle stünde (abgesehen von async/defer). Für dein Poblem ist es auch nicht relevant, woher der Code kommt. Aber die Reihenfolge spielt eine Rolle. Der Code mit dem Wert muss zuerst dastehen, dann die Einbindung. Es sei denn, der Code in der Einbindung definiert nur Funktionen, die erst zu einem späteren Zeitpunkt ausgeführt werden, dann muss der Wert auch erst zum Aufruf bereitstehen.

      if (!empty($_POST['myTest'])) {
      echo("<script type=\"text/javascript\">var test = ".$_POST['myTest'].";</script>");
      }
      

      Das erzeugt unter Umständen ungültigen Javascript-Code. Gültig ist er nur, wenn in $_POST['myTest'] ein Wert steht, den Javascript als Zahlenliteral erkenen kann. Oder als Variablenname (einer Variable im Javascript-Code) oder als anderweitig gültigen Javascript-Code. Und das ist auch ein großes Problem, weil damit beliebiger Javascript-Code eingefügt werden kann. Wenn du stattdessen aus Sicht von Javascript lediglich ein Stringliteral sehen möchtest, fehlen da Anführungszeichen sowie eine kontextgerechte Behandlung des Inhalts von $_POST['myTest']. PHP hat aber keine Funktion, à la htmlspecialchars() für HTML, die für Javascript-Code vorgesehen ist. Stattdessen kann man json_encode() zuzüglich Anführungszeichen drumherum nehmen. Man muss aber sicherstellen, dass in $_POST['myTest'] nur ein String, aber kein Array steckt. Bei geeigneter Verwendung von []-Klammern erzeugt PHP ja nicht nur einen einfachen String, sondern ein Array. Also, ein Typecast zu string ist das mindeste. Bei einem Array kommt dann "Array" als String raus, aber das ist die ungefährliche Variante. Alternativ auf Array testen und die Verarbeitung wegen Betrugsversuchs abbrechen.

      Wie gebe ich der externen js-datei denn eine Variable weiter?

      Du schreibst erstmal nur Javascript-Code. Statt der Einbindung des PHP-Wertes nimmst du einen konstanten Wert, ein Stringliteral oder was auch immer der Wert am Ende sein soll. Nun sorgst du dafür, dass aus Sicht von Javascript alles läuft. Erst dann tauschst du den konstanten Wert so aus, dass der Inhalt der PHP-Variable eingefügt wird, natürlich kontextgerecht.

      Die Strategie ist, statt von vornherein ein komplexes Problem mit mehreren Beteiligten zu lösen, baut man erstmal das eigentliche Ziel für sich auf, und verwendet anstelle der externen Komponenten zunächst Dummy-Werte. Auch die externen Systeme kann man separat aufsetzen und prüfen, ob sie am Ende das erzeugen, was sie sollen. Dann erst baut man alles zusammen und testet die Interaktionen.

      dedlfix.

      1. Hallo dedlfix,

        so Du keiner bist, ist an Dir wirklich ein Lehrer der Extraklasse verloren gegangen.

        Das erzeugt unter Umständen ungültigen Javascript-Code. Gültig ist er nur, wenn in $_POST['myTest'] ein Wert steht, den Javascript als Zahlenliteral erkenen kann. Oder als Variablenname (einer Variable im Javascript-Code) oder als anderweitig gültigen Javascript-Code.

        Soweit schonmal den Fehler gefunden und erklärt.

        Und jezt wirds richtig interessant:

        Und das ist auch ein großes Problem, weil damit beliebiger Javascript-Code eingefügt werden kann. Wenn du stattdessen aus Sicht von Javascript lediglich ein Stringliteral sehen möchtest, fehlen da Anführungszeichen sowie eine kontextgerechte Behandlung des Inhalts von $_POST['myTest'].

        Hab' ich echt nicht dran gedacht.

        PHP hat aber keine Funktion, à la htmlspecialchars() für HTML, die für Javascript-Code vorgesehen ist. Stattdessen kann man json_encode() zuzüglich Anführungszeichen drumherum nehmen.

        Das aber dann jetzt nur, um die reine Weitergabe zu garantieren, oder?

        Man muss aber sicherstellen, dass in $_POST['myTest'] nur ein String, aber kein Array steckt. Bei geeigneter Verwendung von []-Klammern erzeugt PHP ja nicht nur einen einfachen String, sondern ein Array. Also, ein Typecast zu string ist das mindeste. Bei einem Array kommt dann "Array" als String raus, aber das ist die ungefährliche Variante. Alternativ auf Array testen und die Verarbeitung wegen Betrugsversuchs abbrechen.

        Ist denn die Verwendung eines Array das einzig "gefährliche" oder gibt es noch mehr "gefährliche" Zeichen?

        Pit

        1. Tach!

          PHP hat aber keine Funktion, à la htmlspecialchars() für HTML, die für Javascript-Code vorgesehen ist. Stattdessen kann man json_encode() zuzüglich Anführungszeichen drumherum nehmen.

          Das aber dann jetzt nur, um die reine Weitergabe zu garantieren, oder?

          Um zu garantieren, dass das, was du da in das Script reinschreiben lässt, kein Code ist, dessen Ausführung du nicht wünschst, sondern lediglich ein String.

          Man muss aber sicherstellen, dass in $_POST['myTest'] nur ein String, aber kein Array steckt. Bei geeigneter Verwendung von []-Klammern erzeugt PHP ja nicht nur einen einfachen String, sondern ein Array. Also, ein Typecast zu string ist das mindeste. Bei einem Array kommt dann "Array" als String raus, aber das ist die ungefährliche Variante. Alternativ auf Array testen und die Verarbeitung wegen Betrugsversuchs abbrechen.

          Ist denn die Verwendung eines Array das einzig "gefährliche" oder gibt es noch mehr "gefährliche" Zeichen?

          In einem $_POST-Eintrag kann sich nur ein String oder ein Array befinden - solange es von PHP bereitgestellt und nicht durch deinen Code manipuliert wurde.

          Gefährliche Zeichen sind all diejenigen, die dazu führen, dass die von dir mit dem Anführungszeichen eingeleitete Zeichenkette vorzeitig als beendet erkannt werden kann.

          Moment mal, da hab ich was falsches in Erinnerung und erzählt. json_encode() gibt einen String bereits mit passenden Anführungszeichen zurück. Allen weiteren Inhalt maskiert die Funktion ordnungsgemäß.

          Wenn du was testen möchtest, probier mit Zeichen, die in Sting-Literalen von Javascript eine besondere Bedeutung haben, also Anführungszeichen, Zeilenumbrüche und das Maskierzeichen \.

          Ein Array wird von json_encode() vollständig in ein gültiges Array-Literal umgewandelt. Das Problem hieran ist nur, dass dein Javascript-Code eine String annimmt und bei einem Array zumindest außer Tritt kommen kann.

          dedlfix.

    3. Hallo Pit,

      du hast hier (fehlende Quotes ergänzt) …

      if (!empty($_POST['myTest'])) {
      echo("<script type=\"text/javascript\">var test = '".$_POST['myTest']."';</script>");
      }
      

      … aber eine schöne Cross-Site-Scripting-Lücke >:-> Du möchtest $_POST['myTest'] vor der Ausgabe in den Kontext eines JavaScript-Stringliterals bringen.

      Viele Grüße
      Robert

    4. Hi,

      ich versuche, eine Variable aus php an JS weiterzugeben, aber anscheinend kommt sie nicht in JS an. Wichtig ist, sie soll in einem externen js-script verfügbar sein.

      Ok, dann beginnen wir mal damit, wies im DOM ankommt, z.B. so:

        <script src="/var.php"></script>
      

      D.h., Dein var.php hat, mit dem Content-Type: text/javascript JS auszuliefern. Und so kannst Du auch JS-Variablen mit PHP da reinpflanzen. MfG

      1. Tach!

        ich versuche, eine Variable aus php an JS weiterzugeben, aber anscheinend kommt sie nicht in JS an. Wichtig ist, sie soll in einem externen js-script verfügbar sein.

        Ok, dann beginnen wir mal damit, wies im DOM ankommt, z.B. so:

          <script src="/var.php"></script>
        

        Welche Relevanz hat die Repräsentation im DOM für das Problem?

        D.h., Dein var.php hat, mit dem Content-Type: text/javascript JS auszuliefern. Und so kannst Du auch JS-Variablen mit PHP da reinpflanzen.

        Das ist nicht ganz so wichtiges Beiwerk. Man sollte schon den richtigen Content-Type ausliefern, aber die Browser ignorieren den falschen Content-Type und erkennen trotz Auslieferung als text/html den Inhalt als Javascript an. Der richtige Content-Type ändert jedenfalls am eigentlichen Problem nichts.

        dedlfix.

        1. Tach!

          Welche Relevanz hat die Repräsentation im DOM für das Problem?

          Die Herangehensweise!

          1. Tach!

            Welche Relevanz hat die Repräsentation im DOM für das Problem?

            Die Herangehensweise!

            Magst du das genauer erklären?

            dedlfix.

  5. Hi Pit,

    hast Du Dir schon einmal überlegt, HTML mit PHP auszuliefern? Auch da könnte man JS Variablen einbauen die von PHP ausgehen und variabel sind. Idealerweise mcht man sowas über ein Template. MfG