Google Groups no longer supports new Usenet posts or subscriptions. Historical content remains viewable.
Dismiss
validate form; checkboxes
26 views
Skip to first unread message
ms...@podiuminternational.org
Jan 7, 2013, 6:25:01 AM1/7/13
to
Hallo an alle! Mein erstes Posting hier!
Ich möchte ein Formular validieren. Leider schaffe ich es nicht zwei verschiedene checkboxen zu validieren. Alles andere, Text-Felder, Radio, Select-Felder funktioniert. Zur Illustration habe ich ein Beispiel zusammengestellt. Die entscheidenden Zeilen sind:
for ( var i = 0; i < requiredCheckbox.length; i++ ) {
element = requiredCheckbox[i];
if ( form[element].checked )
in denen wohl ein Denkfehler liegt.
Danke für die Hilfe und schönes Neues Jahr 2013
marek
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Check Radio and Checkbox by Javascript</title>
<script type="text/javascript">
function validateForm ( form ) {
requiredSelect = new Array( "fruit_color", "vegetable_color" );
requiredCheckbox = new Array( "apple", "tomato" );
return requireCheckboxes ( form, requiredCheckbox ) &&
requireSelects ( form, requiredSelect ) &&
checkProblems ();
}
function requireSelects ( form, requiredSelect ) {
for ( var i = 0; i < requiredSelect.length; i++ ) {
element = requiredSelect[i];
if ( form[element].selectedIndex <= 0 ) {
alert( "Please select a value for " + element + "." );
return false;
}
}
return true;
}
function requireCheckboxes ( form, requiredCheckbox ) {
for ( var i = 0; i < requiredCheckbox.length; i++ ) {
element = requiredCheckbox[i];
if ( form[element].checked ) {
return true;
}
else {
alert("Bitte klicken Sie " + element.toUpperCase() + " an.");
return false;
}
}
}
function checkProblems () {
for ( element in validate ) {
if ( ! validate[element] ) {
alert( "Please correct the format of " + element + "." );
return false;
}
}
return true;
}
</script>
</head>
<body>
<form id="form" method="post" action="" onsubmit="return validateForm( this )">
<p>
I eat apples:<br />
<label>Yes!</label>
<input type="checkbox" id="apple" name="apple" />
<br />
<select name="fruit_color" id="fruit_color">
<option value="">Please choose a color of your preferred apple</option>
<option value="red">red</option>
<option value="yellow">yellow</option>
<option value="green">green</option>
<option value="rose">rose</option>
</select>
</p>
<p>
I eat tomatoes:<br />
<label>Yes!</label>
<input type="checkbox" id="tomato" name="tomato" />
<br />
<select name="vegetable_color" id="vegetable_color">
<option value="">Please choose a color of your preferred tomato</option>
<option value="red">red</option>
<option value="yellow">yellow</option>
<option value="green">green</option>
<option value="rose">rose</option>
</select>
</p>
<p>
<input type="submit" /><input type="reset" />
</p>
</form>
</body>
</html>
Gregor Kofler
Jan 7, 2013, 8:05:09 AM1/7/13
to
Am 2013-01-07 12:25, ms...@podiuminternational.org meinte:
Weitere Checkboxen interessieren nicht mehr.
Es gibt diverse andere Unsch�nheiten:
- Elemente des Formulars referenziert man korrekterweise �ber die
elements-Collection des form Elements
- Arrays instanziert man besser mit Array-Literalen: []
- element ist ein ungl�cklicher Variablenname und ist au�erdem global
sichtbar
- for ... in Schleifen sollten mit der hasOwnProperty() gefiltert werden
- Woher kommt "validate"?
- ...
[snip]
Gregor
--
http://vxweb.net
>
> Hallo an alle! Mein erstes Posting hier!
>
> Ich m�chte ein Formular validieren. Leider schaffe ich es nicht zwei verschiedene checkboxen zu validieren. Alles andere, Text-Felder, Radio, Select-Felder funktioniert. Zur Illustration habe ich ein Beispiel zusammengestellt. Die entscheidenden Zeilen sind:
> Hallo an alle! Mein erstes Posting hier!
>
>
> for ( var i = 0; i < requiredCheckbox.length; i++ ) {
> element = requiredCheckbox[i];
> if ( form[element].checked )
Du beendest die �berpr�fung, sobald die erste Checkbox angew�hlt ist.
> for ( var i = 0; i < requiredCheckbox.length; i++ ) {
> element = requiredCheckbox[i];
> if ( form[element].checked )
Weitere Checkboxen interessieren nicht mehr.
Es gibt diverse andere Unsch�nheiten:
- Elemente des Formulars referenziert man korrekterweise �ber die
elements-Collection des form Elements
- Arrays instanziert man besser mit Array-Literalen: []
- element ist ein ungl�cklicher Variablenname und ist au�erdem global
sichtbar
- for ... in Schleifen sollten mit der hasOwnProperty() gefiltert werden
- Woher kommt "validate"?
- ...
[snip]
Gregor
--
http://vxweb.net
ms...@podiuminternational.org
Jan 7, 2013, 9:25:06 AM1/7/13
to
Am Montag, 7. Januar 2013 14:05:09 UTC+1 schrieb Gregor Kofler:
> Am 2013-01-07 12:25, marek meinte:
> [snip]
>
> Du beendest die Überprüfung, sobald die erste Checkbox angewählt ist.
>
>
>
> - Elemente des Formulars referenziert man korrekterweise über die
Jetzt sieht mein Beispiel-Skript folgendermaßen aus:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Check Radio and Checkbox by Javascript</title>
<script type="text/javascript">
function validateForm ( form ) {
requiredSelect = new Array( "fruit_color", "vegetable_color" );
requiredCheckbox = new Array( "apple", "tomato" );
return requireCheckboxes ( form, requiredCheckbox ) &&
requireSelects ( form, requiredSelect ) &&
checkProblems ();
}
validate = new Object();
function requireSelects ( form, requiredSelect ) {
for ( var i = 0; i < requiredSelect.length; i++ ) {
element = requiredSelect[i];
if ( form[element].selectedIndex <= 0 ) {
alert( "Please select a value for " + element + "." );
return false;
}
}
return true;
}
function requireCheckboxes ( form, requiredCheckbox ) {
> Am 2013-01-07 12:25, marek meinte:
> [snip]
>
> Du beendest die Überprüfung, sobald die erste Checkbox angewählt ist.
>
> Weitere Checkboxen interessieren nicht mehr.
>
>
>
> Es gibt diverse andere Unschönheiten:
> Weitere Checkboxen interessieren nicht mehr.
>
>
>
>
>
>
> - Elemente des Formulars referenziert man korrekterweise über die
>
> elements-Collection des form Elements
>
> - Arrays instanziert man besser mit Array-Literalen: []
>
> - element ist ein unglücklicher Variablenname und ist außerdem global
> elements-Collection des form Elements
>
> - Arrays instanziert man besser mit Array-Literalen: []
>
>
> sichtbar
>
> - for ... in Schleifen sollten mit der hasOwnProperty() gefiltert werden
>
> - Woher kommt "validate"?
>
> - ...
>
>
>
> [snip]
>
>
>
> Gregor
>
>
>
>
>
> --
>
> http://vxweb.net
Danke Gregor! Danke auch für die vielen Tipps! "elements" werde ich noch ändern! Dieses Skript ist eine Zusammenfassung aus "CGI Programming with Perl", O'Reilly (ich bin also nur ein Script-Kiddy, jedenfalls was Javscript betrifft ...)
> sichtbar
>
> - for ... in Schleifen sollten mit der hasOwnProperty() gefiltert werden
>
> - Woher kommt "validate"?
>
> - ...
>
>
>
> [snip]
>
>
>
> Gregor
>
>
>
>
>
> --
>
> http://vxweb.net
Jetzt sieht mein Beispiel-Skript folgendermaßen aus:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Check Radio and Checkbox by Javascript</title>
<script type="text/javascript">
function validateForm ( form ) {
requiredSelect = new Array( "fruit_color", "vegetable_color" );
requiredCheckbox = new Array( "apple", "tomato" );
return requireCheckboxes ( form, requiredCheckbox ) &&
requireSelects ( form, requiredSelect ) &&
checkProblems ();
}
function requireSelects ( form, requiredSelect ) {
for ( var i = 0; i < requiredSelect.length; i++ ) {
element = requiredSelect[i];
if ( form[element].selectedIndex <= 0 ) {
alert( "Please select a value for " + element + "." );
return false;
}
}
return true;
}
function requireCheckboxes ( form, requiredCheckbox ) {
for ( var i = 0; i < requiredCheckbox.length; i++ ) {
element = requiredCheckbox[i];
if ( ! form[element].checked ) {
element = requiredCheckbox[i];
alert("Bitte klicken Sie " + element.toUpperCase() + " an.");
return false;
}
}
return true;
return false;
}
}
}
function checkProblems () {
for ( element in validate ) {
if ( ! validate[element] ) {
alert( "Please correct the format of " + element + "." );
return false;
}
}
return true;
}
</script>
</head>
<body>
<form id="form" method="post" action="../cgi-bin/order_de.cgi" onsubmit="return validateForm( this )">
function checkProblems () {
for ( element in validate ) {
if ( ! validate[element] ) {
alert( "Please correct the format of " + element + "." );
return false;
}
}
return true;
}
</script>
</head>
<body>
Thomas 'PointedEars' Lahn
Jan 7, 2013, 9:33:16 AM1/7/13
to
ms...@podiuminternational.org wrote:
^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
> Hallo an alle! Mein erstes Posting hier!
Hallo. Beachte dazu bitte die Hinweise am Ende meines Postings.
> Ich möchte ein Formular validieren. Leider schaffe ich es nicht zwei
> verschiedene checkboxen zu validieren. Alles andere, Text-Felder, Radio,
> Select-Felder funktioniert. Zur Illustration habe ich ein Beispiel
> zusammengestellt. Die entscheidenden Zeilen sind:
>
> for ( var i = 0; i < requiredCheckbox.length; i++ ) {
> element = requiredCheckbox[i];
> if ( form[element].checked )
>
> in denen wohl ein Denkfehler liegt.
Wie kommst Du darauf? (ernstgemeinte Frage)
> <!DOCTYPE html>
> <html>
> <head>
> <meta charset="utf-8">
> <title>Check Radio and Checkbox by Javascript</title>
Es gibt kein “Javascript”. Es gibt eine Programmiersprache namens
“JavaScript”. Diese ist eine von vielen Implementierungen eines Standards
für Programmiersprachen, namens “ECMAScript”. Firefox & Co. unterstützen
Mozilla JavaScript. Internet Explorer & Co. unterstützen Microsoft JScript.
Chrome & Co. unterstützen Google V8 JavaScript. Safari unterstützt Apple
JavaScriptCore. Opera unterstützt Opera ECMAScript. Konqueror unterstützt
KDE JavaScript. Und so weiter. Diese Programmiersprachen sind zwar sehr
ähnlich – und alle hier on-topic, aber es sind *verschiedene*
Programmiersprachen.
Zusätzlich gibt es noch von den jeweiligen Umgebungen unterstützte
Programmierschnittstellen (APIs), die nicht zu eiber dieser
Programmiersprachen gehören. Zum Beispiel das Document Object Model (DOM),
mit dem man Formulare validieren kann.
Das solltest Du von Anfang an lernen, sauber voneinander zu trennen.
<http://PointedEars.de/es-matrix>
> <script type="text/javascript">
> function validateForm ( form ) {
> requiredSelect = new Array( "fruit_color", "vegetable_color" );
> requiredCheckbox = new Array( "apple", "tomato" );
^
Du hast vergessen, ”requiredSelect” und “requiredCheckbox” als Variablen zu
deklarieren:
var requiredSelect = new Array( "fruit_color", "vegetable_color" );
var requiredCheckbox = new Array( "apple", "tomato" );
Ohne Deklaration sind Bezeichner, denen Werte zugewiesen werden, keine
Variablen (sondern Eigenschaften) und sie sind global; oder die Zuweisung
selbst führt zu einem Laufzeitfehler. Nicht machen.
Zum Deinem Codestil:
Nach der öffnenden Klammer einer Argumentliste und vor der schliessenden
Klammer sollte kein Leerraum stehen. Ausserdem lässt sich die
Initialisierung von Arrays in allen genannten Implementierungen heutzutage
einfacher und weniger fehlerträchtig schreiben:
var requiredSelect = ["fruit_color", "vegetable_color"];
var requiredCheckbox = ["apple", "tomato"];
Schliesslich sind die Variablenbezeichner nicht gut gewählt. Offensichtlich
können es mehrere select-Elemente und Kontrollkästchen sein, also sollte es
auch “requiredSelects” und “requiredCheckboxes” heissen.
> return requireCheckboxes ( form, requiredCheckbox ) &&
> requireSelects ( form, requiredSelect ) &&
> checkProblems ();
> }
>
> function requireSelects ( form, requiredSelect ) {
Besser lesbar:
function requireSelects (form, requiredSelect)
{
Es gibt Funktionsdeklarationen (siehe oben) und es gibt Funktionsausdrücke:
var requireSelects = function (form, requiredSelect) {
// …
};
Indem Du die geschweifte Klammer bei Deklarationen auf die nächste Zeile
schreibst, lassen sich diese leichter von Ausdrücken unterscheiden. Das ist
wichtig, denn Funktionsdeklarationen sind von Anfang an effektiv, während
Funktionsausdrücke erst während des Programms Wirkung zeigen. Die
Reihenfolge einer Funktionsdeklaration in einem Kontext spielt keine Rolle;
die eines Funktionsausdrucks jedoch schon. (Gleiches gilt übrigens für
Variablendeklaration und Variableninitialisierung.)
Der Funktionsbezeichner ist hier wieder nicht gut gewählt. Du willst in der
Funktion select-Elemente *überprüfen* (check), _nicht_ erfordern (require).
> for ( var i = 0; i < requiredSelect.length; i++ ) {
Besser lesbar und effizienter:
for (var i = 0, len = requiredSelect.length; i < len; ++i)
{
// …
}
Die Länge des Arrays, d. h. die Anzahl seiner Elemente, ändert sich nämlich
in der Schleife nicht (also genügt es, sie einmal – im
Initialisierungsteil – abzufragen) und Dich interessiert der alte Wert von
“i” nicht (also genügt Prä-Inkrement statt Post-Inkrement).
> element = requiredSelect[i];
Nicht deklarierte Variable.
> if ( form[element].selectedIndex <= 0 ) {
> alert( "Please select a value for " + element + "." );
if (form[element].selectedIndex <= 0)
{
window.alert(…);
}
Das ist sauberer, und so erkennst Du gleich den Unterschied zwischen
Programmiersprache und DOM (“window” referenziert ein DOM-Objekt, “alert”
ist der Name einer seiner Methoden).
(Beachte auch dass, “<=” nur dann richtig ist, wenn das select-Element auch
dann nicht validieren soll, wenn man den ersten Eintrag (Index 0) ausgewählt
hat. Andernfalls ist “<” richtig.)
> […]
meisten anderen Browsern eingebaute Debugger (F12-Taste) hätte Dir an dieser
Stelle mitgeteilt, dass der Bezeichner “validate” nicht existiert (die
Referenz kann also nicht aufgelöst werden, und es wird eine
“ReferenceError”-Exception ausgelöst, ein Laufzeitfehler).
*Deshalb* funktioniert Deine Formularvalidierung nicht, denn checkProblems()
wird in validateForm() aufgerufen, wenn requireCheckboxes() und
requireSelects() beide Werte liefern, die zu “true” (wahr) konvertiert
werden können; das macht der “&&”-Operator (logisches UND).
Eine for-in-Schleife eignet sich nur für native Objekte, und unter diesen
nicht für Array-Instanzen. Denn for-in iteriert über die *aufzählbaren*
*Eigenschaften* von Objekten in *beliebiger* Reihenfolge.
Es könnte also sein, dass hier für “validate” vorher
var validate = {
foo: true,
bar: false
};
erwartet wird (“validate” speicherte anschliessend eine Referenz auf eine
Object-Instanz).
Das Problem: Es erben alle neuen Objekte (O.B.d.A.) Eigenschaften von
anderen Objekten über eine eindimensionale Datenstruktur, die “Prototyp-
Kette” genannt wird (ein Objekt ist der Prototyp eines anderen –
prototypbasierte Vererbung). Zum Beispiel
[Object-Instanz: {…} oder new Object()] → Object.prototype
oder
[Array-Instanz: […] oder new Array()] → Array.prototype → Object.prototype
Diese geerbten Eigenschaften können auch aufzählbar sein, und dann iteriert
for-in *auch* über diese. Das will man in der Regel nicht und muss das
deshalb ausschliessen:
for (element in validate)
{
if (validate.hasOwnProperty(element))
{
// …
}
}
Einfacher ist es aber, nur über die Eigenschaften zu iterieren, die einen
auch interessieren. Bei Object-Instanzen seit ECMAScript Edition 5:
var propertyNames = Object.getOwnPropertyNames(validate);
for (var i = 0, len = propertyNames.length; i < len; ++i)
{
var element = propertyNames[i];
}
Bei Arrays “a” ohne Lücken (Arrays mit Lücken heissen “sparse arrays”)
trivialerweise mit
for (var i = 0, len = a.length; i < len; ++i)
{
var element = a[i];
}
oder (rückwärts)
for (var i = a.length; i--;)
{
var element = a[i];
}
Letzteres garantiert dann auch eine Reihenfolge, die überall gleich ist,
denn sie wird vom Index “i” und damit dem Entwickler bestimmt; nicht von der
ECMAScript-Implementierung.
> <form id="form" method="post" action="" onsubmit="return validateForm(
> this )">
Dein form-Element braucht hier keine ID (id-Attribut), denn Du lieferst mit
“this” bereits die Referenz zum entsprechenden Elementobjekt.
Auch wird hier deutlich, weshalb exzessiver Leerraum eher schlechter lesbar
ist.
> <p>
Es handelt sich hier nicht um einen Absatz (Paragraph), sondern um einen
Abschnitt (DIVision). Der richtige Element-Typ ist hier also “div”, sofern
nicht ein anderer Struktur-Typ von HTML5 besser passt.
<http://html5doctor.com/resources/#flowchart>
> I eat apples:<br />
> <label>Yes!</label>
> <input type="checkbox" id="apple" name="apple" />
Besser:
<label for="apple">Yes!</label>
wäre allerdings:
<input type="checkbox" id="apple" name="apple" />
<label for="apple">I eat apples</label>
Siehe auch <http://www.edition-w3.de/TR/1999/REC-
html401-19991224/interact/forms.html#h-17.9.1>
> <input type="submit" />
Dein Submit-Button sollte noch einen Wert (value-Attribut) haben, sonst
erscheint möglicherweise darauf gar kein Text.
> <input type="reset" />
Nicht machen: <http://www.nngroup.com/articles/reset-and-cancel-buttons/>
Und zum Schluss:
Normalerweise lese und beantworte ich Artikel _nicht_, die so wie Deiner
über Google Groups hereinkommen. Es kommt einfach zuviel Müll (Spam)
darüber ins Usenet und Google interessieren Beschwerden von Netznutzern
darüber anscheinend nicht. (Stattdessen bieten sie *nur* *ihren* Nutzern
die Möglichkeit, den Spam auszublenden. Das löst aber das Spam-Problem
nicht und es löst es für alle anderen Netznutzer nicht; siehe
<http://de.wikipedia.org/wiki/Usenet>.)
Du solltest daher einen Newsreader installieren und benutzen lernen, zum
Beispiel <http://getthunderbird.com/> oder <http://userbase.kde.org/KNode>.
Ausserdem solltest Du für das nächste Mal
<http://dcljs.de/> ff.
und
<http://www.tty1.net/smart-questions_de.html>
sorgfältig lesen und anschliessend anwenden. Es ist nämlich eigentlich
_nicht_ akzeptabel, in einer (technischen) Newsgroup
- ohne vollen (und richtigen) Namen (Vor- und Nachname) zu posten.
Internet ist das Ding mit den Kabeln; Usenet ist das Ding mit den
Menschen. Hier kommunizieren Leute miteinander, nicht E-Mail-Adressen.
- sich nicht vor dem Posten selbständig zu informieren und zu versuchen,
damit das Problem selbst zu lösen. (Eigene Lösungsversuche zeigen)
- keine Frage zu stellen. (Fragezeichen fehlt)
- keine Problembeschreibung mitzuliefern (“Geht nicht” ist *keine*
Problembeschreibung: <http://glasgoogle.de/>)
- Viele Zeilen Quelltext ohne weiteren Kommentar und ohne URL eines
Testfalls abzukippen.
Ich habe hier nur eine Ausnahme gemacht, weil Du hier neu bist und
anscheinend ein Anfänger bei diesem Thema bist.
HTH
--
PointedEars
Twitter: @PointedEars2
Please do not Cc: me. / Bitte keine Kopien per E-Mail.
^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
> Hallo an alle! Mein erstes Posting hier!
> Ich möchte ein Formular validieren. Leider schaffe ich es nicht zwei
> verschiedene checkboxen zu validieren. Alles andere, Text-Felder, Radio,
> Select-Felder funktioniert. Zur Illustration habe ich ein Beispiel
> zusammengestellt. Die entscheidenden Zeilen sind:
>
> for ( var i = 0; i < requiredCheckbox.length; i++ ) {
> element = requiredCheckbox[i];
> if ( form[element].checked )
>
> in denen wohl ein Denkfehler liegt.
> <!DOCTYPE html>
> <html>
> <head>
> <meta charset="utf-8">
> <title>Check Radio and Checkbox by Javascript</title>
“JavaScript”. Diese ist eine von vielen Implementierungen eines Standards
für Programmiersprachen, namens “ECMAScript”. Firefox & Co. unterstützen
Mozilla JavaScript. Internet Explorer & Co. unterstützen Microsoft JScript.
Chrome & Co. unterstützen Google V8 JavaScript. Safari unterstützt Apple
JavaScriptCore. Opera unterstützt Opera ECMAScript. Konqueror unterstützt
KDE JavaScript. Und so weiter. Diese Programmiersprachen sind zwar sehr
ähnlich – und alle hier on-topic, aber es sind *verschiedene*
Programmiersprachen.
Zusätzlich gibt es noch von den jeweiligen Umgebungen unterstützte
Programmierschnittstellen (APIs), die nicht zu eiber dieser
Programmiersprachen gehören. Zum Beispiel das Document Object Model (DOM),
mit dem man Formulare validieren kann.
Das solltest Du von Anfang an lernen, sauber voneinander zu trennen.
<http://PointedEars.de/es-matrix>
> <script type="text/javascript">
> function validateForm ( form ) {
> requiredSelect = new Array( "fruit_color", "vegetable_color" );
> requiredCheckbox = new Array( "apple", "tomato" );
Du hast vergessen, ”requiredSelect” und “requiredCheckbox” als Variablen zu
deklarieren:
var requiredSelect = new Array( "fruit_color", "vegetable_color" );
var requiredCheckbox = new Array( "apple", "tomato" );
Ohne Deklaration sind Bezeichner, denen Werte zugewiesen werden, keine
Variablen (sondern Eigenschaften) und sie sind global; oder die Zuweisung
selbst führt zu einem Laufzeitfehler. Nicht machen.
Zum Deinem Codestil:
Nach der öffnenden Klammer einer Argumentliste und vor der schliessenden
Klammer sollte kein Leerraum stehen. Ausserdem lässt sich die
Initialisierung von Arrays in allen genannten Implementierungen heutzutage
einfacher und weniger fehlerträchtig schreiben:
var requiredSelect = ["fruit_color", "vegetable_color"];
var requiredCheckbox = ["apple", "tomato"];
Schliesslich sind die Variablenbezeichner nicht gut gewählt. Offensichtlich
können es mehrere select-Elemente und Kontrollkästchen sein, also sollte es
auch “requiredSelects” und “requiredCheckboxes” heissen.
> return requireCheckboxes ( form, requiredCheckbox ) &&
> requireSelects ( form, requiredSelect ) &&
> checkProblems ();
> }
>
> function requireSelects ( form, requiredSelect ) {
function requireSelects (form, requiredSelect)
{
Es gibt Funktionsdeklarationen (siehe oben) und es gibt Funktionsausdrücke:
var requireSelects = function (form, requiredSelect) {
// …
};
Indem Du die geschweifte Klammer bei Deklarationen auf die nächste Zeile
schreibst, lassen sich diese leichter von Ausdrücken unterscheiden. Das ist
wichtig, denn Funktionsdeklarationen sind von Anfang an effektiv, während
Funktionsausdrücke erst während des Programms Wirkung zeigen. Die
Reihenfolge einer Funktionsdeklaration in einem Kontext spielt keine Rolle;
die eines Funktionsausdrucks jedoch schon. (Gleiches gilt übrigens für
Variablendeklaration und Variableninitialisierung.)
Der Funktionsbezeichner ist hier wieder nicht gut gewählt. Du willst in der
Funktion select-Elemente *überprüfen* (check), _nicht_ erfordern (require).
> for ( var i = 0; i < requiredSelect.length; i++ ) {
for (var i = 0, len = requiredSelect.length; i < len; ++i)
{
// …
}
Die Länge des Arrays, d. h. die Anzahl seiner Elemente, ändert sich nämlich
in der Schleife nicht (also genügt es, sie einmal – im
Initialisierungsteil – abzufragen) und Dich interessiert der alte Wert von
“i” nicht (also genügt Prä-Inkrement statt Post-Inkrement).
> element = requiredSelect[i];
Nicht deklarierte Variable.
> if ( form[element].selectedIndex <= 0 ) {
> alert( "Please select a value for " + element + "." );
{
window.alert(…);
}
Das ist sauberer, und so erkennst Du gleich den Unterschied zwischen
Programmiersprache und DOM (“window” referenziert ein DOM-Objekt, “alert”
ist der Name einer seiner Methoden).
(Beachte auch dass, “<=” nur dann richtig ist, wenn das select-Element auch
dann nicht validieren soll, wenn man den ersten Eintrag (Index 0) ausgewählt
hat. Andernfalls ist “<” richtig.)
> […]
> function checkProblems () {
> for ( element in validate ) {
Ein Debugger wie Firebug (<http://getfirebug.com/>) oder einer der in den
> for ( element in validate ) {
meisten anderen Browsern eingebaute Debugger (F12-Taste) hätte Dir an dieser
Stelle mitgeteilt, dass der Bezeichner “validate” nicht existiert (die
Referenz kann also nicht aufgelöst werden, und es wird eine
“ReferenceError”-Exception ausgelöst, ein Laufzeitfehler).
*Deshalb* funktioniert Deine Formularvalidierung nicht, denn checkProblems()
wird in validateForm() aufgerufen, wenn requireCheckboxes() und
requireSelects() beide Werte liefern, die zu “true” (wahr) konvertiert
werden können; das macht der “&&”-Operator (logisches UND).
Eine for-in-Schleife eignet sich nur für native Objekte, und unter diesen
nicht für Array-Instanzen. Denn for-in iteriert über die *aufzählbaren*
*Eigenschaften* von Objekten in *beliebiger* Reihenfolge.
Es könnte also sein, dass hier für “validate” vorher
var validate = {
foo: true,
bar: false
};
erwartet wird (“validate” speicherte anschliessend eine Referenz auf eine
Object-Instanz).
Das Problem: Es erben alle neuen Objekte (O.B.d.A.) Eigenschaften von
anderen Objekten über eine eindimensionale Datenstruktur, die “Prototyp-
Kette” genannt wird (ein Objekt ist der Prototyp eines anderen –
prototypbasierte Vererbung). Zum Beispiel
[Object-Instanz: {…} oder new Object()] → Object.prototype
oder
[Array-Instanz: […] oder new Array()] → Array.prototype → Object.prototype
Diese geerbten Eigenschaften können auch aufzählbar sein, und dann iteriert
for-in *auch* über diese. Das will man in der Regel nicht und muss das
deshalb ausschliessen:
for (element in validate)
{
if (validate.hasOwnProperty(element))
{
// …
}
}
Einfacher ist es aber, nur über die Eigenschaften zu iterieren, die einen
auch interessieren. Bei Object-Instanzen seit ECMAScript Edition 5:
var propertyNames = Object.getOwnPropertyNames(validate);
for (var i = 0, len = propertyNames.length; i < len; ++i)
{
var element = propertyNames[i];
}
Bei Arrays “a” ohne Lücken (Arrays mit Lücken heissen “sparse arrays”)
trivialerweise mit
for (var i = 0, len = a.length; i < len; ++i)
{
var element = a[i];
}
oder (rückwärts)
for (var i = a.length; i--;)
{
var element = a[i];
}
Letzteres garantiert dann auch eine Reihenfolge, die überall gleich ist,
denn sie wird vom Index “i” und damit dem Entwickler bestimmt; nicht von der
ECMAScript-Implementierung.
> <form id="form" method="post" action="" onsubmit="return validateForm(
> this )">
“this” bereits die Referenz zum entsprechenden Elementobjekt.
Auch wird hier deutlich, weshalb exzessiver Leerraum eher schlechter lesbar
ist.
> <p>
Es handelt sich hier nicht um einen Absatz (Paragraph), sondern um einen
Abschnitt (DIVision). Der richtige Element-Typ ist hier also “div”, sofern
nicht ein anderer Struktur-Typ von HTML5 besser passt.
<http://html5doctor.com/resources/#flowchart>
> I eat apples:<br />
> <label>Yes!</label>
> <input type="checkbox" id="apple" name="apple" />
<label for="apple">Yes!</label>
<input type="checkbox" id="apple" name="apple" />
Nur dann ergibt eine ID für die Checkbox hier Sinn. Benutzerfreundlicher
wäre allerdings:
<input type="checkbox" id="apple" name="apple" />
Siehe auch <http://www.edition-w3.de/TR/1999/REC-
html401-19991224/interact/forms.html#h-17.9.1>
> <input type="submit" />
Dein Submit-Button sollte noch einen Wert (value-Attribut) haben, sonst
erscheint möglicherweise darauf gar kein Text.
> <input type="reset" />
Nicht machen: <http://www.nngroup.com/articles/reset-and-cancel-buttons/>
Und zum Schluss:
Normalerweise lese und beantworte ich Artikel _nicht_, die so wie Deiner
über Google Groups hereinkommen. Es kommt einfach zuviel Müll (Spam)
darüber ins Usenet und Google interessieren Beschwerden von Netznutzern
darüber anscheinend nicht. (Stattdessen bieten sie *nur* *ihren* Nutzern
die Möglichkeit, den Spam auszublenden. Das löst aber das Spam-Problem
nicht und es löst es für alle anderen Netznutzer nicht; siehe
<http://de.wikipedia.org/wiki/Usenet>.)
Du solltest daher einen Newsreader installieren und benutzen lernen, zum
Beispiel <http://getthunderbird.com/> oder <http://userbase.kde.org/KNode>.
Ausserdem solltest Du für das nächste Mal
<http://dcljs.de/> ff.
und
<http://www.tty1.net/smart-questions_de.html>
sorgfältig lesen und anschliessend anwenden. Es ist nämlich eigentlich
_nicht_ akzeptabel, in einer (technischen) Newsgroup
- ohne vollen (und richtigen) Namen (Vor- und Nachname) zu posten.
Internet ist das Ding mit den Kabeln; Usenet ist das Ding mit den
Menschen. Hier kommunizieren Leute miteinander, nicht E-Mail-Adressen.
- sich nicht vor dem Posten selbständig zu informieren und zu versuchen,
damit das Problem selbst zu lösen. (Eigene Lösungsversuche zeigen)
- keine Frage zu stellen. (Fragezeichen fehlt)
- keine Problembeschreibung mitzuliefern (“Geht nicht” ist *keine*
Problembeschreibung: <http://glasgoogle.de/>)
- Viele Zeilen Quelltext ohne weiteren Kommentar und ohne URL eines
Testfalls abzukippen.
Ich habe hier nur eine Ausnahme gemacht, weil Du hier neu bist und
anscheinend ein Anfänger bei diesem Thema bist.
HTH
--
PointedEars
Twitter: @PointedEars2
Please do not Cc: me. / Bitte keine Kopien per E-Mail.
Thomas 'PointedEars' Lahn
Jan 7, 2013, 9:45:03 AM1/7/13
to
>> Ich möchte ein Formular validieren. Leider schaffe ich es nicht zwei
> Es gibt diverse andere Unschönheiten:
>
> - Elemente des Formulars referenziert man korrekterweise über die
> elements-Collection des form Elements
ACK.
> - element ist ein unglücklicher Variablenname und ist außerdem global
> sichtbar
Tatsächlich ist es gar kein Variablenname, sondern im zweitschlimmsten Fall
ein Eigenschaftsname und im schlimmsten Fall ein Laufzeitfehler.
> - for ... in Schleifen sollten mit der hasOwnProperty() gefiltert werden
Oder nicht benutzt werden, siehe meine andere Antwort.
> - Woher kommt "validate"?
Dort liegt in Wirklichkeit des Pudels springender Kern begraben ;-)
>> verschiedene checkboxen zu validieren. Alles andere, Text-Felder, Radio,
>> Select-Felder funktioniert. Zur Illustration habe ich ein Beispiel
>> zusammengestellt. Die entscheidenden Zeilen sind:
>>
>> for ( var i = 0; i < requiredCheckbox.length; i++ ) {
>> element = requiredCheckbox[i];
>> if ( form[element].checked )
>
> Du beendest die Überprüfung, sobald die erste Checkbox angewählt ist.
>> Select-Felder funktioniert. Zur Illustration habe ich ein Beispiel
>> zusammengestellt. Die entscheidenden Zeilen sind:
>>
>> for ( var i = 0; i < requiredCheckbox.length; i++ ) {
>> element = requiredCheckbox[i];
>> if ( form[element].checked )
>
> Weitere Checkboxen interessieren nicht mehr.
Und das ist ein Problem, weil …?
> Es gibt diverse andere Unschönheiten:
>
> elements-Collection des form Elements
ACK.
> - element ist ein unglücklicher Variablenname und ist außerdem global
> sichtbar
ein Eigenschaftsname und im schlimmsten Fall ein Laufzeitfehler.
> - for ... in Schleifen sollten mit der hasOwnProperty() gefiltert werden
> - Woher kommt "validate"?
ms...@podiuminternational.org
Jan 7, 2013, 2:29:28 PM1/7/13
to Thomas 'PointedEars' Lahn
Hallo Thomas!
Ich habe schon vor vier Stunden eine Antwort gepostet. Und zwar mit Thunderbird über den Newsserver nntp.aioe.org ... Aber offenbar ist das nicht durchgekommen. Darf man vielleicht auf diesem Server nicht posten, ohne sich irgendwie anzumelden?
Also alles noch einmal:
Ich bin Dir sehr sehr dankbar für Deine ausführliche Antwort. So detailliert wurde mir noch nie geantwortet :-)
Ich habe versucht, alle Deine Anweisungen umzusetzen. HTML habe ich nur so als Beispiel zusammengestöpselt. Etwas dummes Beispiel. Das Beispiel stammt aus CGI Programming with Perl (O'Reilly). Die Answeisungen zu den {}-Klammern machen Sinn; aber als Perl-Programmierer habe ich da andere Gewohnheiten.
Mein Skript sieht jetzt so aus; und noch mal Danke für die ausführliche Antwort
Das letzte Mal über Google (hoffe ich)
Und mein Name ist Marek Stepanek
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Check Radio and Checkbox by Javascript</title>
<script type="text/javascript">
function validateForm ( form ) {
function validateForm ( form ) {
var requiredSelect = new Array( "fruit_color", "vegetable_color" );
var requiredCheckbox = new Array( "apple", "tomato" );
var requiredCheckbox = new Array( "apple", "tomato" );
return requireCheckboxes ( form, requiredCheckbox ) &&
requireSelects ( form, requiredSelect ) &&
checkProblems ();
}
validate = new Object();
requireSelects ( form, requiredSelect ) &&
checkProblems ();
}
function requireSelects ( form, requiredSelect )
{
{
var element = requiredSelect[i];
if ( form[element].selectedIndex <= 0 )
{
window.alert( "Please select a value for " + element + "." );
return false;
}
}
return true;
}
function requireCheckboxes ( form, requiredCheckbox )
{
for ( var i = 0, len = requiredCheckbox.length; i < len; ++i )
{
var element = requiredCheckbox[i];
if ( ! form[element].checked )
{
window.alert("Bitte klicken Sie " + element.toUpperCase() + " an.");
{
return false;
}
}
return true;
}
function checkProblems ()
{
for ( element in validate ) {
function checkProblems ()
{
for ( element in validate ) {
if ( ! validate[element] ) {
window.alert( "Please correct the format of " + element + "." );
return false;
}
}
return true;
}
</script>
</head>
<body>
<form method="post" action="../cgi-bin/order_de.cgi" onsubmit="return validateForm( this )">
}
}
return true;
}
</script>
</head>
<body>
<p>
<input type="checkbox" id="apple" name="apple" />
<label for="apple">I eat apples:</label>
<label for="apple">I eat apples:</label>
<br />
<select name="fruit_color" id="fruit_color">
<option value="">Please choose a color of your preferred apple</option>
<option value="red">red</option>
<option value="yellow">yellow</option>
<option value="green">green</option>
<option value="rose">rose</option>
</select>
</p>
<p>
<select name="fruit_color" id="fruit_color">
<option value="">Please choose a color of your preferred apple</option>
<option value="red">red</option>
<option value="yellow">yellow</option>
<option value="green">green</option>
<option value="rose">rose</option>
</select>
</p>
<p>
<input type="checkbox" id="tomato" name="tomato" />
<label for="tomato">I eat tomatoes:</label>
<br />
<select name="vegetable_color" id="vegetable_color">
<option value="">Please choose a color of your preferred tomato</option>
<option value="red">red</option>
<option value="yellow">yellow</option>
<option value="green">green</option>
<option value="rose">rose</option>
</select>
</p>
<p>
<input type="submit" value="Abschicken" />
<select name="vegetable_color" id="vegetable_color">
<option value="">Please choose a color of your preferred tomato</option>
<option value="red">red</option>
<option value="yellow">yellow</option>
<option value="green">green</option>
<option value="rose">rose</option>
</select>
</p>
<p>
</p>
</form>
</body>
</html>
Gregor Kofler
Jan 7, 2013, 3:56:43 PM1/7/13
to
Am 2013-01-07 20:29, ms...@podiuminternational.org meinte:
>
>
> Hallo Thomas!
>
> Ich habe schon vor vier Stunden eine Antwort gepostet. Und zwar mit Thunderbird �ber den Newsserver nntp.aioe.org ... Aber offenbar ist das nicht durchgekommen. Darf man vielleicht auf diesem Server nicht posten, ohne sich irgendwie anzumelden?
>
> Also alles noch einmal:
>
> Ich bin Dir sehr sehr dankbar f�r Deine ausf�hrliche Antwort. So detailliert wurde mir noch nie geantwortet :-)
>
> Ich habe versucht, alle Deine Anweisungen umzusetzen. HTML habe ich nur so als Beispiel zusammengest�pselt. Etwas dummes Beispiel. Das Beispiel stammt aus CGI Programming with Perl (O'Reilly). Die Answeisungen zu den {}-Klammern machen Sinn; aber als Perl-Programmierer habe ich da andere Gewohnheiten.
>
> Mein Skript sieht jetzt so aus; und noch mal Danke f�r die ausf�hrliche Antwort
>
> Das letzte Mal �ber Google (hoffe ich)
var requiredSelect = ["fruit_color", "vegetable_color"];
var requiredCheckbox = ["apple", "tomato"];
var validate = {};
aber...
> function checkProblems ()
> {
> for ( element in validate ) {
> if ( ! validate[element] ) {
> window.alert( "Please correct the format of " + element + "." );
> return false;
> }
> }
> return true;
> }
...wozu?
Gregor
>
>
> Hallo Thomas!
>
> Ich habe schon vor vier Stunden eine Antwort gepostet. Und zwar mit Thunderbird �ber den Newsserver nntp.aioe.org ... Aber offenbar ist das nicht durchgekommen. Darf man vielleicht auf diesem Server nicht posten, ohne sich irgendwie anzumelden?
>
> Also alles noch einmal:
>
> Ich bin Dir sehr sehr dankbar f�r Deine ausf�hrliche Antwort. So detailliert wurde mir noch nie geantwortet :-)
>
> Ich habe versucht, alle Deine Anweisungen umzusetzen. HTML habe ich nur so als Beispiel zusammengest�pselt. Etwas dummes Beispiel. Das Beispiel stammt aus CGI Programming with Perl (O'Reilly). Die Answeisungen zu den {}-Klammern machen Sinn; aber als Perl-Programmierer habe ich da andere Gewohnheiten.
>
> Mein Skript sieht jetzt so aus; und noch mal Danke f�r die ausf�hrliche Antwort
>
> Das letzte Mal �ber Google (hoffe ich)
>
>
> Und mein Name ist Marek Stepanek
>
>
> <!DOCTYPE html>
> <html>
> <head>
> <meta charset="utf-8">
> <title>Check Radio and Checkbox by Javascript</title>
> <script type="text/javascript">
> function validateForm ( form ) {
> var requiredSelect = new Array( "fruit_color", "vegetable_color" );
> var requiredCheckbox = new Array( "apple", "tomato" );
besser:
>
> Und mein Name ist Marek Stepanek
>
>
> <!DOCTYPE html>
> <html>
> <head>
> <meta charset="utf-8">
> <title>Check Radio and Checkbox by Javascript</title>
> <script type="text/javascript">
> function validateForm ( form ) {
> var requiredSelect = new Array( "fruit_color", "vegetable_color" );
> var requiredCheckbox = new Array( "apple", "tomato" );
var requiredSelect = ["fruit_color", "vegetable_color"];
var requiredCheckbox = ["apple", "tomato"];
> return requireCheckboxes ( form, requiredCheckbox ) &&
> requireSelects ( form, requiredSelect ) &&
> checkProblems ();
> }
>
> validate = new Object();
besser:
> requireSelects ( form, requiredSelect ) &&
> checkProblems ();
> }
>
> validate = new Object();
var validate = {};
aber...
> function checkProblems ()
> {
> for ( element in validate ) {
> if ( ! validate[element] ) {
> window.alert( "Please correct the format of " + element + "." );
> return false;
> }
> }
> return true;
> }
Gregor
Thomas 'PointedEars' Lahn
Jan 7, 2013, 3:58:43 PM1/7/13
to
ms...@podiuminternational.org wrote:
> Hallo Thomas!
Hallo. An dieser Stelle sollte eine Einleitungszeile stehen (siehe oben).
Hier lesen ja alle mit, nicht in Echtzeit, und es gibt bestimmt nicht nur
einen Thomas im Usenet. (Daran kannst Du auch erkennen, weshalb der
richtige und volle Name in Deinem Absender wichtig ist.)
<http://lernst.de/zitieren/kriegst.de/antworten>
> Ich habe schon vor vier Stunden eine Antwort gepostet. Und zwar mit
> Thunderbird über den Newsserver nntp.aioe.org ... Aber offenbar ist das
> nicht durchgekommen. Darf man vielleicht auf diesem Server nicht posten,
> ohne sich irgendwie anzumelden?
Das weiss ich nicht. Ich weiss allerdings, dass aioe.org ein Trollserver
ist. Den würde ich also an Deiner Stelle auch meiden. (Mit meinem
kostenlosen Account bei news.arcor.de fahre ich seit über einem Jahrzehnt
sehr gut.)
Falls Du Dein aioe.org-Posting in Google Groups suchst: Google Groups ist
ein Usenet-*Archiv*, bekanntermassen spamfreundlich und in fast jeder
Hinsicht kapott. Gelegentlich eignet es sich noch zur Recherche im Usenet,
aber Google ist dabei, diese Möglichkeit schrittweise auch noch kapott zu
machen (das “alte” Google Groups wird “bald” zugunsten des “neuen”
eingestellt, wobei das “neue” noch aber weniger kann und noch kapotter ist
als das “alte”).
Zusätzlich ist das Usenet kein Echtzeitmedium. Zwar sind Newslaufzeiten von
mehr als zwei Stunden ungewöhnlich, aber sie sind möglich. Und Du musst mit
Thunderbird die Artikel auch abholen (<Ctrl>+<T>; das lässt sich je nach
Newsreader automatisieren); von allein erscheinen sie nicht, auch Deine
eigenen nicht.
> Also alles noch einmal:
>
> Ich bin Dir sehr sehr dankbar für Deine ausführliche Antwort. So
> detailliert wurde mir noch nie geantwortet :-)
Gern geschehen.
> Ich habe versucht, alle Deine Anweisungen umzusetzen.
Betrachte (meine) Postings besser als Empfehlungen. Nobody's perfect.
> HTML habe ich nur so als Beispiel zusammengestöpselt. Etwas dummes
> Beispiel. Das Beispiel stammt aus CGI Programming with Perl (O'Reilly).
Ja, hatte ich dann gelesen.
> Die Answeisungen zu den {}-Klammern machen Sinn; aber als Perl-
> Programmierer habe ich da andere Gewohnheiten.
Perl kennt auch Array- und Hash-Initialisierer, daher sollte das Konzept für
Dich nicht neu oder ungewohnt sein.
Was die Leerzeichen um die *runden* Klammern betrifft: Das war mir dann auch
klar. Mein Perl-Editor (EPIC) zwingt mich bei <Ctrl>+<Shift>+<F> auch immer
zu exzessivem Whitespace.
Es ist aber sinnvoll, sich für jede Programmiersprache den *da* üblichen
Codestil anzugewöhnen. Und zu ECMAScript und seinen Implementierungen passt
exzessiver Whitespace à la Perl nicht; schon allein deshalb nicht, weil der
Code in der Regel heruntergeladen werden muss, bevor er kompiliert und das
(Bytecode-)Kompilat ausgeführt wird.
> Mein Skript sieht jetzt so aus; und noch mal Danke für die ausführliche
> Antwort
>
> Das letzte Mal über Google (hoffe ich)
ACK.
> Und mein Name ist Marek Stepanek
Diese Information wirst Du jetzt vielleicht nicht mehr so nützlich finden,
aber in Google Groups kannst Du den Namen für den Absender angeben, wenn Du
die Gruppe abonnierst. Noch.
Ich habe einen Google-Groups-Account, weil ich manchmal dort nachträglich
meine archivierten Usenet-Postings lösche, um Verwirrung unter GG-Nutzern zu
vermeiden. Google Groups führt nämlich auch kein Cancel und kein Supersedes
aus. (Und natürlich melde ich dort Spam, aber das führt ja doch zu nix.)
> var requiredSelect = new Array( "fruit_color", "vegetable_color" );
> var requiredCheckbox = new Array( "apple", "tomato" );
Besser Array-Initialisierer verwenden. (Wie in Perl, bloss mit eckigen
Klammern.)
> validate = new Object();
Analog zu Perls Hash-Initialisierern (“(foo => "bar")”) gibt es Object-
Initialisierer, und analog zu “my” gibt es “var” (jedoch *ohne* Block-
Scoping):
var validate = {};
Es gibt jetzt sogar
"use strict";
am Anfang des Skripts oder der Funktion, welches unter anderem die
Deklaration von Bezeichnern erzwingt (denn die reine Zuweisung führt zu
einem ReferenceError). Du brauchst aber einen Browser mit einer Skript-
Engine, die ECMAScript Edition 5 oder neuer implementiert. Das trifft für
die meisten aktuellen Browser zu, darunter Chromium 17+ (mit Google V8
JavaScript 3.7.12.12+).
> […]
Da ist noch sehr viel zu tun. Am besten, Du liest Gregors und mein Posting
noch einmal gründlicher.
> Hallo Thomas!
Hallo. An dieser Stelle sollte eine Einleitungszeile stehen (siehe oben).
Hier lesen ja alle mit, nicht in Echtzeit, und es gibt bestimmt nicht nur
einen Thomas im Usenet. (Daran kannst Du auch erkennen, weshalb der
richtige und volle Name in Deinem Absender wichtig ist.)
<http://lernst.de/zitieren/kriegst.de/antworten>
> Ich habe schon vor vier Stunden eine Antwort gepostet. Und zwar mit
> Thunderbird über den Newsserver nntp.aioe.org ... Aber offenbar ist das
> nicht durchgekommen. Darf man vielleicht auf diesem Server nicht posten,
> ohne sich irgendwie anzumelden?
ist. Den würde ich also an Deiner Stelle auch meiden. (Mit meinem
kostenlosen Account bei news.arcor.de fahre ich seit über einem Jahrzehnt
sehr gut.)
Falls Du Dein aioe.org-Posting in Google Groups suchst: Google Groups ist
ein Usenet-*Archiv*, bekanntermassen spamfreundlich und in fast jeder
Hinsicht kapott. Gelegentlich eignet es sich noch zur Recherche im Usenet,
aber Google ist dabei, diese Möglichkeit schrittweise auch noch kapott zu
machen (das “alte” Google Groups wird “bald” zugunsten des “neuen”
eingestellt, wobei das “neue” noch aber weniger kann und noch kapotter ist
als das “alte”).
Zusätzlich ist das Usenet kein Echtzeitmedium. Zwar sind Newslaufzeiten von
mehr als zwei Stunden ungewöhnlich, aber sie sind möglich. Und Du musst mit
Thunderbird die Artikel auch abholen (<Ctrl>+<T>; das lässt sich je nach
Newsreader automatisieren); von allein erscheinen sie nicht, auch Deine
eigenen nicht.
> Also alles noch einmal:
>
> Ich bin Dir sehr sehr dankbar für Deine ausführliche Antwort. So
> detailliert wurde mir noch nie geantwortet :-)
> Ich habe versucht, alle Deine Anweisungen umzusetzen.
> HTML habe ich nur so als Beispiel zusammengestöpselt. Etwas dummes
> Beispiel. Das Beispiel stammt aus CGI Programming with Perl (O'Reilly).
> Die Answeisungen zu den {}-Klammern machen Sinn; aber als Perl-
> Programmierer habe ich da andere Gewohnheiten.
Dich nicht neu oder ungewohnt sein.
Was die Leerzeichen um die *runden* Klammern betrifft: Das war mir dann auch
klar. Mein Perl-Editor (EPIC) zwingt mich bei <Ctrl>+<Shift>+<F> auch immer
zu exzessivem Whitespace.
Es ist aber sinnvoll, sich für jede Programmiersprache den *da* üblichen
Codestil anzugewöhnen. Und zu ECMAScript und seinen Implementierungen passt
exzessiver Whitespace à la Perl nicht; schon allein deshalb nicht, weil der
Code in der Regel heruntergeladen werden muss, bevor er kompiliert und das
(Bytecode-)Kompilat ausgeführt wird.
> Mein Skript sieht jetzt so aus; und noch mal Danke für die ausführliche
> Antwort
>
> Das letzte Mal über Google (hoffe ich)
> Und mein Name ist Marek Stepanek
aber in Google Groups kannst Du den Namen für den Absender angeben, wenn Du
die Gruppe abonnierst. Noch.
Ich habe einen Google-Groups-Account, weil ich manchmal dort nachträglich
meine archivierten Usenet-Postings lösche, um Verwirrung unter GG-Nutzern zu
vermeiden. Google Groups führt nämlich auch kein Cancel und kein Supersedes
aus. (Und natürlich melde ich dort Spam, aber das führt ja doch zu nix.)
> var requiredSelect = new Array( "fruit_color", "vegetable_color" );
> var requiredCheckbox = new Array( "apple", "tomato" );
Klammern.)
> validate = new Object();
Analog zu Perls Hash-Initialisierern (“(foo => "bar")”) gibt es Object-
Initialisierer, und analog zu “my” gibt es “var” (jedoch *ohne* Block-
Scoping):
var validate = {};
Es gibt jetzt sogar
"use strict";
am Anfang des Skripts oder der Funktion, welches unter anderem die
Deklaration von Bezeichnern erzwingt (denn die reine Zuweisung führt zu
einem ReferenceError). Du brauchst aber einen Browser mit einer Skript-
Engine, die ECMAScript Edition 5 oder neuer implementiert. Das trifft für
die meisten aktuellen Browser zu, darunter Chromium 17+ (mit Google V8
JavaScript 3.7.12.12+).
> […]
Da ist noch sehr viel zu tun. Am besten, Du liest Gregors und mein Posting
noch einmal gründlicher.
Gregor Kofler
Jan 7, 2013, 3:58:55 PM1/7/13
to
Am 2013-01-07 15:45, Thomas 'PointedEars' Lahn meinte:
wird moniert, das Gemüse aber nie.
>> - Woher kommt "validate"?
>
> Dort liegt in Wirklichkeit des Pudels springender Kern begraben ;-)
Auch die Neufassung des OP wird da nicht erhellender...
Gregor
> Gregor Kofler wrote:
>
>> Am 2013-01-07 12:25, ms...@podiuminternational.org meinte:
>>> Ich möchte ein Formular validieren. Leider schaffe ich es nicht zwei
>>> verschiedene checkboxen zu validieren. Alles andere, Text-Felder, Radio,
>>> Select-Felder funktioniert. Zur Illustration habe ich ein Beispiel
>>> zusammengestellt. Die entscheidenden Zeilen sind:
>>>
>>> for ( var i = 0; i < requiredCheckbox.length; i++ ) {
>>> element = requiredCheckbox[i];
>>> if ( form[element].checked )
>>
>> Du beendest die Überprüfung, sobald die erste Checkbox angewählt ist.
>> Weitere Checkboxen interessieren nicht mehr.
>
> Und das ist ein Problem, weil …?
Weil das das ist, was "nicht funktioniert". Das nicht angeklickte Obst
>
>> Am 2013-01-07 12:25, ms...@podiuminternational.org meinte:
>>> Ich möchte ein Formular validieren. Leider schaffe ich es nicht zwei
>>> verschiedene checkboxen zu validieren. Alles andere, Text-Felder, Radio,
>>> Select-Felder funktioniert. Zur Illustration habe ich ein Beispiel
>>> zusammengestellt. Die entscheidenden Zeilen sind:
>>>
>>> for ( var i = 0; i < requiredCheckbox.length; i++ ) {
>>> element = requiredCheckbox[i];
>>> if ( form[element].checked )
>>
>> Du beendest die Überprüfung, sobald die erste Checkbox angewählt ist.
>> Weitere Checkboxen interessieren nicht mehr.
>
> Und das ist ein Problem, weil …?
wird moniert, das Gemüse aber nie.
>> - Woher kommt "validate"?
>
> Dort liegt in Wirklichkeit des Pudels springender Kern begraben ;-)
Gregor
Gregor Kofler
Jan 7, 2013, 4:03:55 PM1/7/13
to
Nachtrag:
> if ( form[element].selectedIndex <= 0 )
Wechsle auf das bereits angesprochene form.elements[element] (und nenne
es "elementName" oder dergleichen).
Und nochwas: Tabulatoren verursachen im Newsreader oft heftige
Einr�ckungen mit einhergehender schlechter Lesbarkeit; besser
Tabulatoren in 2 Leerzeichen konvertieren.
Gregor
> if ( form[element].selectedIndex <= 0 )
es "elementName" oder dergleichen).
Und nochwas: Tabulatoren verursachen im Newsreader oft heftige
Einr�ckungen mit einhergehender schlechter Lesbarkeit; besser
Tabulatoren in 2 Leerzeichen konvertieren.
Gregor
Thomas 'PointedEars' Lahn
Jan 7, 2013, 4:46:05 PM1/7/13
to
Gregor Kofler wrote:
> Am 2013-01-07 15:45, Thomas 'PointedEars' Lahn meinte:
>> Gregor Kofler wrote:
>>> Am 2013-01-07 12:25, ms...@podiuminternational.org meinte:
>>>> Ich möchte ein Formular validieren. Leider schaffe ich es nicht zwei
>>>> verschiedene checkboxen zu validieren. Alles andere, Text-Felder,
>>>> Radio, Select-Felder funktioniert. Zur Illustration habe ich ein
>>>> Beispiel zusammengestellt. Die entscheidenden Zeilen sind:
>>>>
>>>> for ( var i = 0; i < requiredCheckbox.length; i++ ) {
>>>> element = requiredCheckbox[i];
>>>> if ( form[element].checked )
>>>
>>> Du beendest die Überprüfung, sobald die erste Checkbox angewählt ist.
>>> Weitere Checkboxen interessieren nicht mehr.
>>
>> Und das ist ein Problem, weil …?
>
> Weil das das ist, was "nicht funktioniert". Das nicht angeklickte Obst
> wird moniert, das Gemüse aber nie.
So hatte ich das OP nicht verstanden, aber das ergibt durchaus Sinn.
> Am 2013-01-07 15:45, Thomas 'PointedEars' Lahn meinte:
>> Gregor Kofler wrote:
>>> Am 2013-01-07 12:25, ms...@podiuminternational.org meinte:
>>>> Ich möchte ein Formular validieren. Leider schaffe ich es nicht zwei
>>>> verschiedene checkboxen zu validieren. Alles andere, Text-Felder,
>>>> Radio, Select-Felder funktioniert. Zur Illustration habe ich ein
>>>> Beispiel zusammengestellt. Die entscheidenden Zeilen sind:
>>>>
>>>> for ( var i = 0; i < requiredCheckbox.length; i++ ) {
>>>> element = requiredCheckbox[i];
>>>> if ( form[element].checked )
>>>
>>> Du beendest die Überprüfung, sobald die erste Checkbox angewählt ist.
>>> Weitere Checkboxen interessieren nicht mehr.
>>
>> Und das ist ein Problem, weil …?
>
> Weil das das ist, was "nicht funktioniert". Das nicht angeklickte Obst
> wird moniert, das Gemüse aber nie.
>>> - Woher kommt "validate"?
>> Dort liegt in Wirklichkeit des Pudels springender Kern begraben ;-)
>
> Auch die Neufassung des OP wird da nicht erhellender...
Elementname-Boolean-Paaren sein, deren Eigenschaften während require…()
geändert werden (falls nicht gültig, von “true” auf “false”). Allerdings
wären mehrere window.alerts() nacheinander relativ benutzerunfreundlich.
Diese Annahme führt uns zu
var validationResult = {
apple: true,
fruit_color: true,
tomato: true,
vegetable_color: true
};
und statt
function checkProblems ()
{
for ( element in validate ) {
if ( ! validate[element] ) {
return false;
}
}
return true;
}
zum Quickhack
function requireCheckboxes (form, requiredCheckbox)
{
for (var i = 0, len = requiredCheckbox.length; i < len; ++i)
{
var element = requiredCheckbox[i];
if (! form.elements[element].checked)
{
validationResult[element] = false;
}
}
return true;
}
function checkProblems ()
{
var errors = [];
}
return true;
}
function checkProblems ()
{
/*
* Annahme: validationResult = Object.create(null) oder keine
* Erweiterung von Object.prototype; Reihenfolge egal
*/
for (var element in validationResult)
{
if (! validationResult[element])
{
errors.push("Please correct the format of " + element + ".");
}
}
if (errors.length > 0)
{
window.alert(errors.join("\n"));
return false;
}
return true;
}
YMMV.
0 new messages