onlick mit 2 functionen, return problem(anfänger:) )

[Olli]

Ich sitze gerade am Game of Life, wer es nicht kennt kann es gerne mal googeln.

Dort habe ich ein Formular mit 2 eingaben (breite,hoehe).
Diese will ich prüfen.

  
<form name="feldErstellen">  
            <div>  
                Feld Erstellen: </br>  
                Breite<input name="breite" type="text" size="1" value="20" > X          Höhe<input name="hoehe" type="text" size="1" value="20" >  
                <input type="button" value="Erstellen" onclick="return eingabePruefen();tabelleAnpassen(document.feldErstellen.breite.value,document.feldErstellen.hoehe.value)">  
            </div>  
        </form>

Mit dem return vor eingabePruefung will ich erreichen das wenn die Eingabe falsch sein sollte er tabelleAnpassen nicht ausführt und somit die bestehende tabelle zu sehen bleibt.

Die 2 functionen sehen so aus :

  
function eingabePruefen(){  
  var fehler = 0;  
  for (i = 0; i < document.feldErstellen.breite.value.length; ++i){  
    if (document.feldErstellen.breite.value.charAt(i) < '0' ||  
        document.feldErstellen.breite.value.charAt(i) > '9')  
      fehler = 1;  
    if (fehler == 1) {  
      alert("Bitte geben sie eine gültige zahl ein!");  
      document.feldErstellen.breite.focus();  
      return false;  
    }  
  }  
}

prüft jetzt nur ein feld ich weis aber für das andere wäre es ja das gleiche .

  
function tabelleAnpassen(breite,hoehe){  
    $('#rasta').empty();  
    $('#rasta').html(tabelleErstellen(breite, hoehe));  
}  
  
function tabelleErstellen(breite,hoehe){  
    var cid=0;  
    var tabelle = document.createElement('table');  
    tabelle.setAttribute('style', 'border-collapse:collapse;')  
    document.getElementById('rasta').appendChild(tabelle);  
    for (i=0;i<hoehe;i++){  
       var tr=tabelle.insertRow(0);  
       for (j=0;j<breite;j++){  
           cid++;  
           var td=tr.insertCell (0);  
           td.setAttribute('id', cid);  
           td.setAttribute('class', 'white')  
       }  
    }  
}

Ich denke ich habe das mit dem return im event handler, falsch benutzt.

Ohne das return geht es. Es wird geprüft und bei Fehler kommt die Fehlermeldung und der focus wird gesetzt. Allerdings verschwindet auch die vorhandene Tabelle.
Mit return kommt im falle einer falsch Eingabe die Fehlermeldung, der focus wird gesetzt und die Tabelle bleibt bestehen allerdings habe ich dann "das Problem" das im falle einer gültigen Angabe er die 2 function nicht ausführt.

Klar ich könnte das prüfen und ändern zusammenfügen, dann würde es wohl gehen, allerdings bin ich jetzt auch neugierig, warum es so nicht funktioniert.

Bitte um Hilfe
Grazie

[1UnitedPower]

function eingabePruefen(){
  var fehler = 0;
  for (i = 0; i < document.feldErstellen.breite.value.length; ++i){
    if (document.feldErstellen.breite.value.charAt(i) < '0' ||
        document.feldErstellen.breite.value.charAt(i) > '9')
      fehler = 1;
    if (fehler == 1) {
      alert("Bitte geben sie eine gültige zahl ein!");
      document.feldErstellen.breite.focus();
      return false;
    }
  }
}

  
Das geht auch einfacher:  
  
~~~javascript
  
!/\D/.test( document.feldErstellen.breite.value );  

~~~       

[1UnitedPower]

Mit dem return vor eingabePruefung will ich erreichen das wenn die Eingabe falsch sein sollte er tabelleAnpassen nicht ausführt und somit die bestehende tabelle zu sehen bleibt.

Mit @return gibst du nur den Rückgabewert einer Funktion an.
Wie wäre ist mit @if?

[Olli]

Mit dem return vor eingabePruefung will ich erreichen das wenn die Eingabe falsch sein sollte er tabelleAnpassen nicht ausführt und somit die bestehende tabelle zu sehen bleibt.

Mit @return gibst du nur den Rückgabewert einer Funktion an.

Ok. Allerdings verstehe ich dann nicht warum es im ersten fall nicht geklappt hat. Ich meine klar, wenn false zurückgeliefert wird, wird der onlick event unterbrochen(meine Annahme). Allerdings auch wenn ich der prüf function am ende true zurück geben habe lassen, hatte ich den gleichen effect. Das verstehe ich nicht. Sorry das ich dich hier mit meinen Anfänger fragen "nerve".

Wie wäre ist mit @if?

Stimmt, klar mit @if geht es:
if (eingabePruefen() != false)tabelleErstellen();

[Der Martin]

Hallo,

Mit @return gibst du nur den Rückgabewert einer Funktion an.

und nicht nur das.

Ok. Allerdings verstehe ich dann nicht warum es im ersten fall nicht geklappt hat. Ich meine klar, wenn false zurückgeliefert wird, wird der onlick event unterbrochen(meine Annahme). Allerdings auch wenn ich der prüf function am ende true zurück geben habe lassen, hatte ich den gleichen effect. Das verstehe ich nicht.

Das ist so, weil mit return nicht nur der Rückgabewert festgelegt wird, sondern die Funktion (bzw. hier der Eventhandler) auch sofort an der Stelle beendet wird. Was nach dem return noch notiert wird, ist toter Code, der nie erreicht wird.

Sorry das ich dich hier mit meinen Anfänger fragen "nerve".

Dafür musst du dich nicht entschuldigen, wir haben schließlich alle mal klein angefangen. Und dieses Verständnis für Kontrollstrukturen ist Grundwissen, das für viele Programmiersprachen gilt.

Ciao,
 Martin