select box auf auswahl prüfen

südpol

Erfahrenes Mitglied
Hi,

sorry, dass ich zu dem Thema hier was poste - es gibt auf google etc. 1000 Anleitungen dafür - jedoch habe ich noch keine verständliche gefunden, die ich für meine Zwecke nutzen kann.

Mein Problem ist vermutlich ganz einfach zu lösen (wenn man ne Ahnung von js hat...) und sieht wie folgt aus:

ich habe ein Formular in welchem eine Selectbox liegt. Diese selectbox wird an ein php script übergeben und verarbeitet. Da ich die Fehlermeldungen über Fehleingaben nicht erst bei der Verarbeitung ausgeben möchte würde ich gerne js dafür einsetzten (bei input fehldern geht das auch schon ganz gut).

das ganz sieht z. B. so aus:

Code:
<form action="test.php" name="form" method="post">
<select name="werte[]">
    <option value="1">Text</option>
    <option value="2">Text</option>
    <option value="3">Text</option>
    <option value="4">Text</option>
</select>
<input type="submit" value="senden">
</form>

kann mir jemand sagen wie meine js function aussehen muss, damit der user gleich ne Meldung bekommt, wenn er nichts ausgewählt hat und senden will?

Danke
 
Du kannst mal folgendes Script austesten:
Code:
<form onsubmit="window.alert(this.elements['Foo'].selectedIndex);">
  <select name="Foo">
    <option value="1">Feld 1</option>
    <option value="2">Feld 2</option>
    <option value="3">Feld 3</option>
    <option value="4">Feld 4</option>
  </select>
  <br />
  <br />
  <input type="submit" value="Abschicken" />
</form>
Erklärung: Wenn das Formular gesendet wird, wird per alert die Nummer das aktuell gewählten
Select-Feldes angezeigt (Feld 1 -> 0, Feld 2 -> 1, Feld 3 -> 2, usw.).
Da diese aber schon 0 ist, wenn man noch gar nichts ausgewählt hat (Firefox 0.9) gehe ich mal
davon aus, dass man das Ganze so wie du dir es vorstellst nicht machen kannst.

Also musst du auf ein zusätzliches Feld ausweichen:
Code:
<form onsubmit="if(this.elements['Foo'].selectedIndex == 0) { window.alert('Bitte etwas auswaehlen'); return false; }">
  <select name="Foo">
    <option value="unused">Bitte waehlen</option>
    <option value="1">Feld 1</option>
    <option value="2">Feld 2</option>
    <option value="3">Feld 3</option>
    <option value="4">Feld 4</option>
  </select>
</form>

hth
 
danke, der 2. Ansatz ist echt gut scheint so weit zu funktionieren.

Kann ich die funktion nun auch irgendwie in den header schreiben und vor allem auf mehrere Checkboxen innerhalb eines formulares anwenden? Javascript kann doch bestimmt auch sowas wie variablen übergeben - dann könnte es evtl. auch reichen die funktion nur ein mal in den head zu schreiben und einfach nur an jeder zu prüfenden select box den namen selbiger an die funktion zu übergen.

(Sorry für meine vermutlich blöden Fragen - hatte leider noch keien Zeit mich in js einzulesen und arbeite pirmär mit php und brauche somit auch nur sehr wenig js...)

Danke für eure Hilfe!
 
Hallo,

du hast zwei Möglichkeiten:

1) Du gibst nur das Formular an, filterst alle Select-Boxen raus und schaust, ob
selectedIndex > 0 ist.

2) Du gibst explizit an, welche Select Boxen geprüft werden sollen.


Der Code dazu:
Code:
<html>
  <head>
  <script type="text/javascript">

  /* Methode 1 */
  function checkAllSelect(a_oForm)
  {
      oEl = a_oForm.elements;

      for (sElement in oEl) {
          if (   oEl[sElement].type
              && (oEl[sElement].type.substr(0, 6) == 'select')
              && (oEl[sElement].selectedIndex == 0)) {
              window.alert('Bitte alle Select-Boxen ausfuellen!');

              return false;
          }
      }

      return true;
  }

  /* Methode 2 */
  function checkSelect(a_oForm, a_aSel)
  {
      oEl = a_oForm.elements;

      for (iKey in a_aSel) {
          if (oEl[a_aSel[iKey]].selectedIndex == 0) {
              window.alert('Bitte alle Select-Boxen ausfuellen!');

              return false;
          }
      }

      return true;
  }

  </script>
</head>
  <body>
    <!-- Nr 1 -->
    <form action="ziel.php" onsubmit="return checkAllSelect(this);" method="post">
    <!-- Nr 2 -->
    <!--<form action="ziel.php" onsubmit="return checkSelect(this, new Array('Foo', 'Foo2'));" method="post">-->

      <select name="Foo">
        <option value="unused">Bitte w&auml;hlen</option>
        <option value="1">Feld 1</option>
        <option value="2">Feld 2</option>
        <option value="3">Feld 3</option>
      </select>

      <br />
      <select name="Foo2">
        <option value="unused">Bitte w&auml;hlen</option>
        <option value="1">Feld 1</option>
        <option value="2">Feld 2</option>
        <option value="3">Feld 3</option>

      </select>
      <br />
      <br />
      <input type="submit" value="bla" />
    </form>
  </body>
</html>
 
Zuletzt bearbeitet von einem Moderator:
Zurück