Formularfelder @ tutorials.de: Tutorials, Forum & Hilfe

Eclipse16V · 11.02.12 21:42

Hallo,
habe mir ein Formular gebastelt in dem man per DropDown Feld das Land auswählen kann. Nun möchte ich es aber auch so haben das man neben diesem DropDown Feld für das Land noch ein DropDown Feld angezeigt bekommt wo man dann das Bundesland bzw. Kanton auswählen kann. Nur möchte ich es so haben das automatisch wenn man im Feld Land z.B. Deutschland auswählt, im Feld Bundesland die Deutschen Bundesländer erscheinen und nicht alle Bundesländer.
Wie kann ich das in die Wirklichkeit umsetzen?
Gibt es da schon was fertiges?

Danke schon mal.

***einfach nur crack*** · 11.02.12 22:28

Code Javascript:

window.addEventListener('DOMContentLoaded', function () {
  var states = {
    de: [
      'Baden-Würtemberg',
      'Bayern',
      'Berlin',
      'Brandenburg',
      'Bremen',
      'Hamburg',
      'Hessen',
      'Mecklenburg-Vorpommern',
      'Niedersachsen',
      'Nordrhein-Westfalen',
      'Rheinland-Pfalz',
      'Saarland',
      'Sachsen',
      'Sachsen-Anhalt',
      'Schleswig-Holstein',
      'Thüringen'
      ],
    au: [],
    ch: []
  };
  var country = document.getElementById('registry-countries');
  country.addEventListener('change', function () {
    var element = document.getElementById('registry-states');
    element.innerHTML = '';
    for(var i = 0; i < states[this.value].length; ++i) {
      var option = document.createElement('option');
      option.innerText = states[this.value][i];
      element.appendChild(option);
    }
  }, false);
}, false);

HTML-Code:

<form action="">
  <select id="registry-countries" name="registry[country]" size="1">
    <option value="de">Deutschland</option>
    <option value="au">Österreich</option>
    <option value="ch">Schweiz</option>
  </select>
  <select id="registry-states" name="registry[state]" size="1"></select>
</form>

.. das kannst du hier direkt ausprobieren: http://jsfiddle.net/MeiKatz/yFJGT/2/

Eclipse16V · 12.02.12 08:09

Dank dir.
Aber wenn ich das dort ausprobieren möchte, zeigt er mir nur die Länder an und in dem anderen Feld ändert sich nichts bzw. wird nichts angezeigt egal was man macht.

***einfach nur crack*** · 12.02.12 12:33

Dann wechsle erstmal zu einem anderen Land und dann zurück zu Deutschland. Für die anderen beiden Länder ist auch nichts definiert.

Nachtrag: Ich habe jetzt alle Bundesländer und Kantone eingetragen und es werden jetzt auch vom Anfang an die deutschen Bundesländer angezeigt: http://jsfiddle.net/MeiKatz/yFJGT/4/

Eclipse16V · 12.02.12 12:57

Formularfelder-fireshot-screen-capture-014-edit-fiddle-jsfiddle-online-editor-web-javascr.png

Entweder bin ich Blind oder zu blöde.
Ich sehe da nix von Bundesländern und da ist es egal ob Deutschland oder Schweiz.

***einfach nur crack*** · 12.02.12 13:05

Der Bildschirm ist doch in vier Bereiche geteilt: CSS, HTML, Javascript und Ausgabe. Letzteres ist interessant und das ist das rechts unten. Dort steht sogar bei dir Deutschland. Wenn du dort drauf klickst, sollte sich das Ganze ändern.

Eclipse16V · 12.02.12 13:12

Ja das war mir schon klar mit dem rechten Feld dort unten aber wenn ich da z.B. Schweiz nehme, ändert sich nix. Das Zweite Feld kann man zwar aufklappen aber es ist leer. Dort stehen dann keine Kanton oder Bundesländer.
Nutze FF 10.0.1

***einfach nur crack*** · 12.02.12 13:16

Mh, vielleicht geht es, wenn du oben auf Run klickst.

Eclipse16V · 12.02.12 13:20

Dann kommt rechts unten im Fenster folgendes:

{"error": "Please use POST request"}

***einfach nur crack*** · 12.02.12 13:25

Mh, komisch. Ansonsten kopierst du dir einfach den Quelltext, fügst ihn in eine eigene HTML-Datei ein und führst es bei dir lokal aus. Ist letztendlich das Gleiche.

HTML-Code:

<!DOCTYPE html>
<html>
<head>
  <title>Länderauswahl</title>
  <script type="text/javascript">
  window.addEventListener('DOMContentLoaded', function () {
    var states = {
      de: [
        'Baden-Würtemberg',
        'Bayern',
        'Berlin',
        'Brandenburg',
        'Bremen',
        'Hamburg',
        'Hessen',
        'Mecklenburg-Vorpommern',
        'Niedersachsen',
        'Nordrhein-Westfalen',
        'Rheinland-Pfalz',
        'Saarland',
        'Sachsen',
        'Sachsen-Anhalt',
        'Schleswig-Holstein',
        'Thüringen'
        ],
      au: [
        'Burgenland',
        'Kärnten',
        'Niederösterreich',
        'Oberösterreich',
        'Salzburg',
        'Steiermark',
        'Tirol',
        'Vorarlberg',
        'Wien'
        ],
      ch: [
        'Zürich',
        'Bern',
        'Luzern',
        'Uri',
        'Schwyz',
        'Obwalden',
        'Nidwalden',
        'Glarus',
        'Zug',
        'Freiburg',
        'Solothurn',
        'Basel-Stadt',
        'Basel-Landschaft',
        'Schaffhausen',
        'Appenzell Ausserrhoden',
        'Appenzell Innerrhoden',
        'St. Gallen',
        'Graubünden',
        'Aargau',
        'Thurgau',
        'Tessin',
        'Waadt',
        'Wallis',
        'Neuenburg',
        'Genf',
        'Jura'
        ]
    };
    var country = document.getElementById('registry-countries');
    var element = document.getElementById('registry-states');
    for(var i = 0; i < states['de'].length; ++i) {
      var option = document.createElement('option');
      option.innerText = states['de'][i];
      element.appendChild(option);
    }
    country.addEventListener('change', function() {
      var element = document.getElementById('registry-states');
      element.innerHTML = '';
      for(var i = 0; i < states[this.value].length; ++i) {
        var option = document.createElement('option');
        option.innerText = states[this.value][i];
        element.appendChild(option);
      }
    }, false);
  }, false);
  </script>
</head>
<body>
  <form action="">
    <select id="registry-countries" name="registry[country]" size="1">
      <option value="de">Deutschland</option>
      <option value="au">Österreich</option>
      <option value="ch">Schweiz</option>
    </select>
    <select id="registry-states" name="registry[state]" size="1"></select>
  </form>
</body>
</html>

Eclipse16V · 12.02.12 13:35

OK
Teste ich mal später.

Eclipse16V · 13.02.12 18:44

Hi,
so, habe es jetzt mal in eine test.php Datei gepackt und auf meinen Server geladen.
Leider bekomme ich da genau das gleiche wie vorher. Deutschland und Co. wird angezeigt und der Rest nicht.

***einfach nur crack*** · 13.02.12 19:04

Kann man den Quelltext mal sehen? (Bei mir lokal läuft es problemlos: Chrome 16.0.912.77, Mac OS 10.6.7)

Eclipse16V · 13.02.12 19:21

http://www.tornado-map.info/map/test.php

***einfach nur crack*** · 13.02.12 19:32

Bei mir geht's.

tut orials.de	tut verbinden	tut dir helfen	tut kooperieren
©2000-2012 tutorials.de Alle Rechte vorbehalten	tut informieren » Impressum » Nutzungsregeln » Netiquette » Team » Redaktion	» Tutorials » Videotutorials » Showroom » Events & Contests » Chat » RSS-Feed » Blogs	» der-webdesigner.net » DesignerInAction » Design Nation » Directorforum » Flashhilfe » PHP-Resource » PHPwelt » PSD-Tutorials

Themen-Optionen

Anzeige

Ähnliche Themen

Formularfelder überprüfen!

Formularfelder Kontrollieren

3 Formularfelder überprüfen

Formularfelder

formularfelder

E-Mail:

Abonnieren Abbestellen