girasol: Formular ausfüllen durch DropDown Auswahl

Halli Hallo,

ich hoffe Ihr könnt mir weiterhelfen. bin schon halb verzweifelt, da meine bisherige Websuche erfolglos blieb....

Folgendes:
Ich habe ein php-Webformular mit einem Dropdown Auswahlfeld. Die einzelnen "option Vlaues" darin ziehe ich aus einer MySQL Datenbank. Funktioniert wuderbar mit:

<html>  
    <head>  
    <title> DropDown aus SQL-Daten </title>  
    </head>  
    <body>  
Auswahl: <form action="" method="post"><select name="abs_id" size="1">  
<?php  
mysql_connect("host", "user", "pw") or die ("Unable to connect to database. Err.: ".mysql_error());  
mysql_select_db("datenbank") or die ("Unable to select database. Err.: ".mysql_error());  
$query="SELECT ID, feld1 FROM tabelle WHERE benutzerdaten_ID = '2' or benutzerdaten_ID = '0'";  
$result = mysql_query($query) or die("Err.:".mysql_error());  
while ($rows = mysql_fetch_array($result,MYSQL_ASSOC))  
{  
echo "<option name=\"ID\" value=\"".$rows["ID"]."\">".$rows["feld1 "]."</option>";  
}?>  
</select></form>  
    </body>  
</html> 

mit der Einschränkung der benutzerdaten_ID wird dafür gesorgt, dass nur die Daten des eingeloggten Users angezeigt werden.

Nun hatte ich ursprünglich das ganze mal mit einer Beschränkten Auswahl erstellt (nur zwei Optionen), und daher ohne DB. Mit Hilfe von einer JavaScript funktion konnte ich dann der DropDown Auswahl einen Wert zu ordnen. Also beim Anwählen von Auswahl1 wurden die Werte aa,bb,cc... ins Formular abgefüllt, und bei der Auswahl2 wurden die Formularfelder leer angezeigt.
Hier das entsprechende Script:

<script language="JavaScript" type="text/javascript">  
   function change() {  
   var weauswahl = document.forms[0].auswahl.value;  
   if(weauswahl == "Auswahl1"){  
      document.getElementsByName("wefirma")[0].value="aa";  
      document.getElementsByName("wename")[0].value="bb";  
     document.getElementsByName("westrasse")[0].value="cc";  
       document.getElementsByName("weplz")[0].value="dd";  
       document.getElementsByName("weort")[0].value="ee";  
    }  
   else{  
       document.getElementsByName("wefirma")[0].value="";  
     document.getElementsByName("wename")[0].value="";  
      document.getElementsByName("westrasse")[0].value="";  
      document.getElementsByName("weplz")[0].value="";  
      document.getElementsByName("weort")[0].value="";  
       }  
   }  
  </script>  
  
  <select name="auswahl" width="200" size="1" onChange="change()">  
   <option value="Bitte w&auml;hlen">Bitte wählen</option>  
   <option value="Auswahl1">Auswahl1</option>  
   <option value="Auswahl2">Auswahl2</option>  
  </select>

Das Ziel wäre es nun die beiden "Dinge" zu verbinden. Hierzu müsste ich eine Weitere SQL SELECT Abfrage einfügen bei der ich die JavaScript Variabel "weauswahl" als Kriterium wähle. Weiss aber nicht wie ich das hin bekomme, ohne einen Sendenbutton zu integrieren?!

Oder gäbe es sogar noch eine einfahcere Lösung?

Vielen Dank schonmal für eure Hilfe

Grüsse
Girasol

  1. Mahlzeit girasol,

    Das Ziel wäre es nun die beiden "Dinge" zu verbinden. Hierzu müsste ich eine Weitere SQL SELECT Abfrage einfügen bei der ich die JavaScript Variabel "weauswahl" als Kriterium wähle. Weiss aber nicht wie ich das hin bekomme, ohne einen Sendenbutton zu integrieren?!

    Also zumindest ich habe nichts verstanden. Vielleicht könntest Du den gewünschten Ablauf einfach nochmal in einfachen Worten vollkommen ohne Quellcode formulieren?

    Oder gäbe es sogar noch eine einfahcere Lösung?

    Vielleicht. Wohlmöglich nach einer verständlicheren Problembeschreibung.

    MfG,
    EKKi

    --
    sh:( fo:| ch:? rl:( br:> n4:~ ie:% mo:} va:) de:] zu:) fl:{ ss:) ls:& js:|
    1. Vielleicht hilft es ja, wenn ich die Umstände eher auf die Anwendung bezogen erkläre anstatt aus Programmiersicht.

      Also:
      Das ganze gehört zu einem Prozess bei dem ein Kunde bei sich Ware abholen lassen kann und diese dann zu einem Warenempfänger seiner Wahl transportieren lassen kann. (Transportaufträge)

      Ich habe eine Webseite mit einem Loginbereich. Dafür können sich Kunden anmelden. (Login in PHP und MySQL-DB)
      Im Loginbereich gibt es ein Bestellformular welches beim Aufrufen gleich die Adressfelder des Absenders ausfüllt. Die Daten dazu werden aus der selben Tabelle gezogen wie die Login Daten (Username, Passwort).
      Weiter gibt es nochmals Adressfelder, dies mal aber für die Adresse des Warenempfängers. Diese Warenempfänger sind in einer anderen Tabelle der MySQL-DB festgehalten.
      Zur Vereinfachung des Kunden, soll er den gewünschten Warenempfänger aus einem Dropdown Menü auswählen können, so dass anschliessend entsprechend der Auswahl die Adressfelder gefüllt werden.

      Der Stand ist nun der dass ich im DropDownFeld die Warenempfänger zwar zur Auswahl habe, es aber nicht fertig bringe, dass sich beim wechseln des Warenempfängers die Adressfelder entsprechend ausfüllen.

      Bei einer früheren Version dieses Formulars war es so, dass es nur zwei Auswahlmöglichkeiten gab, da hatte ich das Problem nur mit Hilfe von JavaScript (Siehe Code vom ersten Posting) gelöst, also ohne DB. Weiss nun aber nicht wie ich eine SQL Abfrage mit dem JavaScripg in Verbindung bringen kann!

      Verständlicher?

      Hier noch ein Bild des Formulars:
      formular.jpg

      1. Mahlzeit girasol,

        Der Stand ist nun der dass ich im DropDownFeld die Warenempfänger zwar zur Auswahl habe, es aber nicht fertig bringe, dass sich beim wechseln des Warenempfängers die Adressfelder entsprechend ausfüllen.

        1. Möglichkeit: Du liest vorher per SQL alle möglichen Empfänger aus und generierst mittels PHP Javascript-Code, der ein Array mit den Daten aller möglichen Empfänger aufbaut. Dann kannst Du einfach beim Ändern der Auswahlliste den passenden Eintrag aus dem Array nehmen und dessen Daten in die Textfelder einfüllen.

        2. Möglichkeit: Du führst beim Ändern der Auswahlliste mittels Javascript im Hintergrund einen XMLHTTPRequest aus (AJAX), der Dir frisch vom Server die Daten des ausgewählten Empfängers holt und in die Textfelder einträgt.

        Verständlicher?

        Ja, viel! :-)

        MfG,
        EKKi

        --
        sh:( fo:| ch:? rl:( br:> n4:~ ie:% mo:} va:) de:] zu:) fl:{ ss:) ls:& js:|
        1. Vorerst mal besten Dank EKKi

          Ich habe mich für die Variante mit dem Arrays entschieden, die klingt für mich irgendwie sympathischer :o)

          Ich hoffe ich schaffe es mich weiterhin verständlich ausdrücken ;o)

          Ich bin nun soweit, dass ich mit der SQL-Abfrage ein Array aufbaue und die einzelnen Daten daraus auch ausgeben kann. Die Ausgabe habe ich so angepasst dass sie in meinem DropDown Feld erscheint. Nun bin ich wieder da angelangt, wo ich die Adressfelder "automatisch" ausfüllen lassen will.

          Ich habe für die Adressausgabe wiederum mein JavaScript verwendet. Das Problem ist nun, dass nur wenn ich den letzten Eintrag im DropDown Menü auswähle, so werden die Werte für die Felder "wename" und "wefirma" übernommen. Dies kann ich auch nachvollziehen, denn die Variabel mit der ich abchecke ($i --> if(weauswahl == ".$i.")) ist nach der foreach-Schlaufe auf dem letzten Wert.  Kannst du mir vielleicht dabei weiterhelfen, mit welcher Variabel ich den Wert abchecken muss damit es funktioniert?

          Hier doch nochmals ein Code auschnitt:

            
          $query="SELECT wefirma, wename FROM wedaten WHERE benutzerdaten_ID = '0' or benutzerdaten_ID = '$WEID'";  
          $result = mysql_query($query) or die("Err.:".mysql_error());  
            
          $list = array();  
          while ($row = mysql_fetch_assoc($result)) {  
             $list[] = $row;  
          }  
            
          foreach ($list as $i => $record) {  
            // echo $i, ". ", $record['wefirma'], " - ", $record['wename'], "<br />\n";  
             echo "<option value=".$i.">", $record['wefirma'],"</option>";  
            }  
             echo "<script language='JavaScript' type='text/javascript'>  
             function change() {  
             var weauswahl = document.forms[0].auswahl.value;  
             if(weauswahl == ".$i."){  
                 document.getElementsByName('wefirma')[0].value='", $record['wefirma'],"';  
               document.getElementsByName('wename')[0].value='", $record['wename'],"';  
                document.getElementsByName('westrasse')[0].value='';  
                document.getElementsByName('weplz')[0].value='';  
                document.getElementsByName('weort')[0].value='';  
              }  
             }  
            </script>";  
          
          
          1. Mahlzeit girasol,

            Ich habe für die Adressausgabe wiederum mein JavaScript verwendet. Das Problem ist nun, dass nur wenn ich den letzten Eintrag im DropDown Menü auswähle, so werden die Werte für die Felder "wename" und "wefirma" übernommen. Dies kann ich auch nachvollziehen, denn die Variabel mit der ich abchecke ($i --> if(weauswahl == ".$i.")) ist nach der foreach-Schlaufe auf dem letzten Wert.  Kannst du mir vielleicht dabei weiterhelfen, mit welcher Variabel ich den Wert abchecken muss damit es funktioniert?

            Ich habe das Gefühl, dass Dir ein grundsätzliches Verständnis dafür fehlt, was wann wo abläuft. PHP erzeugt auf dem Server HTML (und ggf. Javascript) und der Server schickt dann den generierten Code an den Browser. Dem Browser ist es pupsegal, ob das, was er bekommt, von PHP generiert wurde oder so als Datei auf dem Server liegt: er kann er nur HTML darstellen und maximal Javascript-Code ausführen.

            Das bedeutet aber auch, dass der Browser nicht auf irgendwelche Variableninhalte, die irgendwelche PHP-Variablen vielleicht irgendwann mal auf dem Server gehabt haben mögen, zugreifen kann, wenn der Benutzer im Browser irgendeine Handlung vornimmt.

            Du hast folgendes Aufgabe:

            Erstelle mittels PHP gültigen Javascript-Code, der die gewünschte Dynamik auf Clientseite ermöglicht.

            Dazu ist einerseits der PHP-Code relevant, da es in ihm darum geht, auf die richtige Art und Weise Ausgaben vorzunehmen, die dann HTML und Javascript darstellen. Andererseits ist dann dieser generierte Javascript-Code relevant, um die gewünschte Interaktivität im Browser zu erreichen.

            Wenn Du jetzt ein Problem im Bereich Javascript ist, ist es nur bedingt hilfreich, wenn Du PHP-Code postest: schau in den HTML-Quelltext, was dort für Javascript-Code steht. Wenn dieser fehlerhaft ist, schau im PHP-Code nach, warum er fehlerhaft erzeugt wird: Zitat 1353

            [code lang=php]
            $query="SELECT wefirma, wename FROM wedaten WHERE benutzerdaten_ID = '0' or benutzerdaten_ID = '$WEID'";
            $result = mysql_query($query) or die("Err.:".mysql_error());

            $list = array();
            while ($row = mysql_fetch_assoc($result)) {
               $list[] = $row;
            }

            Vollkommen irrelevant. Wenn die Abfrage grundsätzlich funktioniert und Du eine Ergebnismenge bekommst, warum ist dann dieser Code Teil Deiner Fehlerbeschreibung?

            foreach ($list as $i => $record) {
              // echo $i, ". ", $record['wefirma'], " - ", $record['wename'], "<br />\n";
               echo "<option value=".$i.">", $record['wefirma'],"</option>";

            Du gibst an dieser Stelle lediglich die einzelnen Optionen Deiner Auswahlliste aus. Du generierst keinen Javascript-Code, mittels dessen Dein Browser wüsste, welche anderen Daten er bei anderen gewählten Optionen in die Eingabefelder schreiben soll.

            }
               echo "<script language='JavaScript' type='text/javascript'>
               function change() {
               var weauswahl = document.forms[0].auswahl.value;
               if(weauswahl == ".$i."){

            Hier steht natürlich immer der letzte Wert der PHP-Variable. Das bedeutet aber auch, dass Deine Funktion nur bei einer gewählten Option reagiert. Sie ist also mehr oder weniger sinnlos.

            document.getElementsByName('wefirma')[0].value='", $record['wefirma'],"';

            Hier weist Du dem entsprechenden Element immer den entsprechenden Wert des letzten Datensatzes zu. Konsequenz: s.o.

            document.getElementsByName('wename')[0].value='", $record['wename'],"';

            Hier genauso.

            Im Moment hast Du also mehr ein konzeptionelles Problem als ein technisches.

            Nochmal:

            1.) Hole Dir die Daten aus der Datenbank.

            2.) Erzeuge mittels PHP einer einer Schleife sowohl die einzelnen Optionen der Auswahlliste (HTML) als auch ein Array mit den Daten aller möglichen Optionen (Javascript). Sinnvollerweise tust Du das NICHT durch mehrfaches Aufrufen von echo, sondern indem Du zwei getrennte Strings zusammenbastelst, die Du anschließend so ausgibst, dass der so erzeugte HTML-/Javascript-Code auch valide ist und funktionieren kann.

            3.) Schreibe eine Javascript-Funktion, die beim Ändern der Auswahlliste je nach aktuellem Wert die passenden Daten aus dem o.g. Array in die Eingabefelder schreibt.

            MfG,
            EKKi

            --
            sh:( fo:| ch:? rl:( br:> n4:~ ie:% mo:} va:) de:] zu:) fl:{ ss:) ls:& js:|
          2. Hallo

            Ich habe mich für die Variante mit dem Arrays entschieden, die klingt für mich irgendwie sympathischer :o)

            Damit überträgst du aber alle Adressdaten _aller_ Kunden an _jeden_ anfragenden Browser. Jeder Kunde kann sich so eine Liste aller anderen Kunden generieren, wenn er in den Quelltext des JavaScripts schaut. Willst du das?

            Bei der Ajax-Version werden, im Gegensatz dazu, nur die Daten des betreffenden Kunden erst nach Eintrag des Benutzernamens übermittelt.

            Tschö, Auge

            --
            Die deutschen Interessen werden am Liechtenstein verteidigt.
            Veranstaltungsdatenbank Vdb 0.2
            1. Hallo Auge,

              Der Kunde ist ja wenn er diese abfrage macht, bereits eingeloggt, also werden so in der SQL Abfrage nur die Daten für diesen Kunden ermittelt.

              Ich verstehe was du meinst mit dem Quelltext, hatte den Gedanken auch.
              Aber mein Ziel wäre es da ja nicht alle Möglichkeiten der JavaScript Abfrage in der Programmierung zu haben, sondern, dass die gewählten per Abfrage geholt werden. So wären dann im Quelltext stets nur die gerade die Daten sichtbar, welche auch im Formular stehen.  --> oder ist dies gar nicht erst möglich?

              Oder könntest du mir dabei helfen wie dies in eineier Ajax-Version gelöst werden könnte? Konnte drum mit Ajax noch so gut wie keine Erfahrungen sammeln.

              Gruss
              Girasol

              1. Mahlzeit girasol,

                Aber mein Ziel wäre es da ja nicht alle Möglichkeiten der JavaScript Abfrage in der Programmierung zu haben,

                Doch.

                sondern, dass die gewählten per Abfrage geholt werden. So wären dann im Quelltext stets nur die gerade die Daten sichtbar, welche auch im Formular stehen.  --> oder ist dies gar nicht erst möglich?

                Doch - z.B. mit AJAX. Anscheinend hast Du meine Vorschläge nicht wirklich verstanden.

                Oder könntest du mir dabei helfen wie dies in eineier Ajax-Version gelöst werden könnte? Konnte drum mit Ajax noch so gut wie keine Erfahrungen sammeln.

                AJAX ist Javascript. Das einzig besondere daran ist die Nutzung von XMLHTTPRequests. Lies Dir entsprechende Tutorials (z.B. dies hier) durch.

                MfG,
                EKKi

                --
                sh:( fo:| ch:? rl:( br:> n4:~ ie:% mo:} va:) de:] zu:) fl:{ ss:) ls:& js:|
                1. Muss für die Funktion von Ajax ein bestimmtes DLL oder PlugIn installiert werden auf dem Server?

                  Ich erhalte stets die JavaScript Fehlermeldung "Ajax ist undefiniert" für die Zeile mit dem Inhalt:
                    new Ajax.Request('return.php?kat1=' + (document.getElementById('kat1').value), {method: 'get', onComplete: GetKat2});

                  Zu Beginn der Seite leite ich das Script ein mit
                  <script type="text/javascript" src="js/prototype.js"></script>
                  ein

                  1. Mahlzeit girasol,

                    Muss für die Funktion von Ajax ein bestimmtes DLL oder PlugIn installiert werden auf dem Server?

                    Nein, Dein Browser muss nur ein XMLHTTPRequest-Objekt (die verschiedenen Browser in ihren verschiedenen Versionen haben da unterschiedliche zur Auwahl) existieren.

                    Ich erhalte stets die JavaScript Fehlermeldung "Ajax ist undefiniert" für die Zeile mit dem Inhalt:
                      new Ajax.Request('return.php?kat1=' + (document.getElementById('kat1').value), {method: 'get', onComplete: GetKat2});

                    Das Objekt "Ajax" gibt es auch nicht im handelsüblichen Javascript-Sprachumfang. Außerdem ist der Code merkwürdig - Du willst anscheinend eine neue Instanz des Ajax-Objekts erzeugen ... tust es aber nicht. Informiere Dich über die richtige Syntax.

                    Zu Beginn der Seite leite ich das Script ein mit
                    <script type="text/javascript" src="js/prototype.js"></script>

                    Aha, Du nutzt also ein Framework. Hast Du Dich auf den Seiten von Prototype informiert, wo der Fehler liegen könnte? Existiert die Datei auch dort auf dem Server? Kannst Du andere Prototype-Objekte bzw. Funktionen benutzen?

                    MfG,
                    EKKi

                    PS: Die Sprache, die Du benutzt, heißt "Javascript" - es ist nicht sinnvoll, den Quellcode als [code lang=java] auszuzeichen ...

                    --
                    sh:( fo:| ch:? rl:( br:> n4:~ ie:% mo:} va:) de:] zu:) fl:{ ss:) ls:& js:|