Christopf: Eingabefelde Wert limitieren

SELF-Forum

Eingabefelde Wert limitieren

Christopf
– Informationen zu den Bewertungsregeln

Hy,
wie kann ich es realisieren, Zahlenwerte einzugrenzen? Also ganz einfaches Beispiel:
Ich habe ein Inputfeld mit der ID: breite und es sollen nur Werte zwischen 25 und 250 angenommen werden. Alle zahlen die Außerhalb dieses Bereiches liegen sollen eine Fehlermeldung verursachen...
hier mein Quellcode:

<script type="text/javascript">
function chkFormular () {
 if (document.Formular.breite.value == "") {
    alert("Bitte geben Sie eine Breite ein");
    document.Formular.beite.focus();
    return false;
 }
  var chkZ = 1;
  for (i = 0; i < document.Formular.breite.value.length; ++i)
    if (document.Formular.breite.value.charAt(i) < "0" ||
        document.Formular.breite.value.charAt(i) > "9")
      chkZ = -1;
  if (chkZ == -1) {
    alert("Bitte geben Sie eine Zahl ein!");
    document.Formular.breite.focus();
    return false;
  }
}
</script>
<style type="text/css">
<!--
.Stil1 {font-size: 9px}
-->
</style>
</head>

<body>
<form id="Formular" name="Formular" method="post" onsubmit="return chkFormular()">
  <label>Limitierung:<br />
  <br />
  <label>Breite
  <input name="breite" type="text" id="breite" size="6" maxlength="3" />
  </label>
  <span class="Stil1">(min. 25 cm max. 250cm)  </span>
  <label><br />
<input type="submit" name="Submit" value="Senden" />
</label>
</form>

Beitrag melden
–
Informationen zu den Bewertungsregeln

  1. Eingabefelde Wert limitieren

    steckl
    – Informationen zu den Bewertungsregeln

    Hi,

    wie kann ich es realisieren, Zahlenwerte einzugrenzen? Also ganz einfaches Beispiel:
    Ich habe ein Inputfeld mit der ID: breite und es sollen nur Werte zwischen 25 und 250 angenommen werden. Alle zahlen die Außerhalb dieses Bereiches liegen sollen eine Fehlermeldung verursachen...

    Du koenntest mit isNaN() abpruefen, ob es sich um eine Zahl handelt und danach ueberpruefen, ob die Zahl >= 25 und <= 250 ist.

    In dem geposteten Quellcode hast du noch einen Tippfehler:

    document.Formular.beite.focus();

    beite sollte wohl breite heissen.

    mfG,
    steckl

    Beitrag melden
    –
    Informationen zu den Bewertungsregeln

    1. Eingabefelde Wert limitieren

      Christoph
      – Informationen zu den Bewertungsregeln

      So hat alles sehr gut Funktioniert. Der Form halber poste ich noch den Code:

      <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
      <html xmlns="http://www.w3.org/1999/xhtml">
      <head>
      <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
      <title>Limitierung</title>
      </head>
      <script type="text/javascript">
      function chkFormular () {
       if (document.Formular.breite.value == "") {
          alert("Bitte geben Sie eine Breite ein");
          document.Formular.breite.focus();
          return false;
       }
        if (document.Formular.breite.value <= 25) {
          alert("Minimale Breite ist 25 cm!");
          document.Formular.breite.focus();
          return false;
       }
        if (document.Formular.breite.value >= 250) {
          alert("Maximale Breite ist 250 cm!");
          document.Formular.breite.focus();
          return false;
       }
        var chkZ = 1;
        for (i = 0; i < document.Formular.breite.value.length; ++i)
          if (document.Formular.breite.value.charAt(i) < "0" ||
              document.Formular.breite.value.charAt(i) > "9")
            chkZ = -1;
        if (chkZ == -1) {
          alert("Bitte geben Sie eine Zahl ein!");
          document.Formular.breite.focus();
          return false;
        }
      }
      </script>
      <style type="text/css">
      <!--
      .Stil1 {font-size: 9px}
      -->
      </style>
      </head>

      <body>
      <form id="Formular" name="Formular" method="get" onSubmit="return chkFormular()">
        <label>Limitierung:<br />
        <br />
        <label>Breite
        <input name="breite" type="text" id="breite" size="6" maxlength="3" />
        </label>
        <span class="Stil1">(min. 25 cm max. 250cm)  </span>
        <label><br />
      <input type="submit" name="Submit" value="Senden" />
      </label>
      </form>
      <body>
      </body>
      </html>

      Beitrag melden
      –
      Informationen zu den Bewertungsregeln

      1. Eingabefelde Wert limitieren

        rfb Homepage des Autors
        – Informationen zu den Bewertungsregeln

        Moin

        Nur so als Anregung: die JavaScript-Funktion ließe sich bei gleicher Wirkung zusammenfassen auf:

        function chkFormular () {  
var eingabe=document.Formular.breite.value;  
if (isNaN(eingabe) || eingabe<25 || eingabe>250) {  
 alert("Geben Sie als Breite eine Zahl zwischen 25 und 250 ein");  
 document.Formular.breite.focus();  
 return false;  
}  
else return true;  
}

        Gruß
        rfb

        --
        Man kann einen Menschen nichts lehren, man kann ihm nur helfen, es selbst zu entdecken.
        (Galileo Galilei)
        Beitrag melden
        –
        Informationen zu den Bewertungsregeln