nicht angemeldet
Formulareingaben auf Vollständigkeit prüfen
Hallo,
in der Datei plausiCheck.js ist dieses Skript abgelegt
function PlausiCheckOptionsliste(){
var ergebnisPlausiprüfung = "";
/* Schleife für die text-Parameter Anfang */
/* Schleife für die text-Parameter Ende */
for (var i=0;i < zuCheckenderParameterText.length;i++){
Optionsliste = document.getElementsByName(zuCheckenderParameterText[i]);
OptionslisteLaenge = Optionsliste.length ;
var auswahlGetroffen = false;
for (var j = 1; j < OptionslisteLaenge; j++){
if (Optionsliste [j].value!=""){
auswahlGetroffen = true;
}
}
if(!auswahlGetroffen) {
ergebnisPlausiprüfung+= document.getElementsByName(zuCheckenderParameterText[i])[0].innerText + "\n";
Optionsliste [0].style.color = "red";
}
}
/* Schleife für die checked-Parameter Anfang */
for (var i=0;i < zuCheckenderParameter.length;i++){
Optionsliste = document.getElementsByName(zuCheckenderParameter[i]);
OptionslisteLaenge = Optionsliste.length ;
var auswahlGetroffen = false;
for (var j = 1; j < OptionslisteLaenge; j++){
if (Optionsliste [j].checked){
auswahlGetroffen = true;
}
}
if(!auswahlGetroffen) {
ergebnisPlausiprüfung+= document.getElementsByName(zuCheckenderParameter[i])[0].innerText + "\n";
Optionsliste [0].style.color = "red";
}
}
/* Schleife für die checked-Parameter Ende */
/* Ausgabe der Liste von Datenfeldern, wo die Eingabewerte fehlen*/
if (ergebnisPlausiprüfung !="")
{alert ( "Bitte Angaben vervollständigen: \n\n" + ergebnisPlausiprüfung )}
}
Dieses Skript wird in einer HTML-Seite eingebunden:
<html><head><title>Test</title>
<script type="text/javascript" src="plausiCheck.js"></script>
</head>
<body>
<form action="" onSubmit="PlausiCheckOptionsliste()">
<h1 id="themaID">Text-Eingaben</h1>
<p>
<input type="text" name="themaID" /> thema_ID<br />
</p>
<h1 id="tabellenOrGrafikLinks" >tabellenOrGrafikLinks</h1>
<input name="tabellenOrGrafikLinks" type="radio" value="tabelle"/> tabellenOrGrafikLinks<br />
<input name="tabellenOrGrafikLinks" type="radio" value="grafik" /> tabellenOrGrafikLinks<br />
<h1 id="seitentyp" >Seitentyp</h1>
<input name="seitentyp" type="radio" value="seitentyp0"/> seitentyp0<br />
<input name="seitentyp" type="radio" value="seitentyp1" /> seitentyp1<br />
<input name="seitentyp" type="radio" value="seitentyp2" /> seitentyp2<br />
<button type="submit" style="font-size: 9pt">Eingabe prüfen</button>
</form>
<hr/>
<script type="text/javascript">
/* hier müssen die zu checkende Parameter vor der Einbindung der PlausiCheckOptionsliste()-Methode erst einzeln in einer richtigen Reihenfolge festgelegt werden */
var zuCheckenderParameter = new Array();
zuCheckenderParameter[0] = "tabellenOrGrafikLinks";
zuCheckenderParameter[1] = "seitentyp";
/* Parameter vom Typ Text festlegen */
var zuCheckenderParameterText = new Array();
zuCheckenderParameterText[0] = "themaID";
// -->
</script>
</body></html>
Beim Drücken des Buttons 'Eingabe prüfen' wird die Funktion PlausiCheckOptionsliste() ausgeführt, die prüft, ob die entsprechende Felder angeklickt bzw. gefüllt wurden. Alles funktioniert wunderbar, aber ich bilde mir ein, dass es eine Lösung geben muß, wo beide Überprüfungen:
if (Optionsliste [j].value!="")
und
if (Optionsliste [j].checked)
in einer
for (var i=0;i < zuCheckenderParameter.length;i++)
Schleife durchgeführt werden können. Habe versucht die beide Bedingungen in _einer_ Schleife so
...
for (var j = 1; j < OptionslisteLaenge; j++){
if (Optionsliste [j].value!="" || Optionsliste [j].checked){
auswahlGetroffen = true;
}
...
oder so
...
if (Optionsliste [j].checked ){
auswahlGetroffen = true;
}
if ( Optionsliste [j].value!=""){
auswahlGetroffen = true;
}
...
zu verknüpfen, aber unverständlicherweise wird bei dieser Variante nur das Feld 'Text-Eingaben' ( id="themaID") geprüft. Vielleicht hat jemand Lust und Zeit, sich meine Lösung unter die Lupe zu nehmen und sich Gedanken zu machen, wie man die Überprüfung in einer Schleife umsetzen kann?
gruss
Gustav
-
Hallo,
/* hier müssen die zu checkende Parameter vor der Einbindung der PlausiCheckOptionsliste()-Methode erst einzeln in einer richtigen Reihenfolge festgelegt werden */
Warum machst du es so kompliziert? Willst du nur bestimmte Felder prüfen? Es wäre viel einfacher, alle Formularfelder zu durchlaufen und zu prüfen.
Vielleicht hat jemand Lust und Zeit, sich meine Lösung unter die Lupe zu nehmen und sich Gedanken zu machen, wie man die Überprüfung in einer Schleife umsetzen kann?
Viel einfacher:
function check (formularobjekt) {
var ergebnis = "";
for (var i = 0; i < felder.length; i++) {
feldgruppe = document.forms[formularobjekt.name].elements[ felder[i] ];
feldanzahl = feldgruppe.length;
var auswahlGetroffen = false;
for (var j = 0; j < feldanzahl; j++) {
if (
(feldgruppe[j].type == "text" && feldgruppe[j].value != "") ||
feldgruppe[j].checked
) {
auswahlGetroffen = true;
}
}
if (!auswahlGetroffen) {
ueberschriftobjekt = document.getElementById(felder[i]);
ergebnis += ueberschriftobjekt.firstChild.nodeValue + "\n";
ueberschriftobjekt.style.color = "red";
}
}
if (ergebnis != "") {
window.alert("Bitte Angaben vervollständigen:\n\n" + ergebnis);
return false;
}
return true;
}<form action="" onsubmit="return check(this)" name="formular">
...Mathias
-
Da fehlte noch:
<script type="text/javascript">
var felder = ["tabellenOrGrafikLinks", "seitentyp", "themaID"];
</script>
Bei dieser Version müssen die zu überprüfenden Felder also noch angegeben werden. -
Hallo, Mathias,
Warum machst du es so kompliziert? Willst du nur bestimmte Felder prüfen?
In meinem echten Formular sind tatsächlich nicht alle Felder unbedingt auszufüllen. Also liste ich mit
var zuCheckenderParameter = new Array();zuCheckenderParameter[0] = "tabellenOrGrafikLinks";
zuCheckenderParameter[1] = "seitentyp";/* Parameter vom Typ Text festlegen */
var zuCheckenderParameterText = new Array();
zuCheckenderParameterText[0] = "themaID";
// -->
</script>explizit auf, welche Text oder radio-Felder _müssen_ gefüllt sein.
Es wäre viel einfacher, alle Formularfelder zu durchlaufen und zu prüfen.
Viel einfacher:
function check (formularobjekt) {
var ergebnis = "";
for (var i = 0; i < felder.length; i++) {
feldgruppe = document.forms[formularobjekt.name].elements[ felder[i] ];
feldanzahl = feldgruppe.length;
var auswahlGetroffen = false;
for (var j = 0; j < feldanzahl; j++) {
if (
(feldgruppe[j].type == "text" && feldgruppe[j].value != "") ||
feldgruppe[j].checked
) {
auswahlGetroffen = true;
}
}
if (!auswahlGetroffen) {
ueberschriftobjekt = document.getElementById(felder[i]);
ergebnis += ueberschriftobjekt.firstChild.nodeValue + "\n";
ueberschriftobjekt.style.color = "red";
}
}
if (ergebnis != "") {
window.alert("Bitte Angaben vervollständigen:\n\n" + ergebnis);
return false;
}
return true;
}Ich habe deine Lösung so in dieser HTML-Seite eingebunden
<html><head><title>Test</title>
<script type="text/javascript" src="plausicheck.js"></script>
</head>
<body>
<form action="" onSubmit="return check(this)" name="formular">
<h1 id="themaID">Text-Eingaben</h1>
<p>
<input type="text" name="themaID" /> thema_ID<br /></p>
<h1 id="tabellenOrGrafikLinks" >tabellenOrGrafikLinks</h1>
<input name="tabellenOrGrafikLinks" type="radio" value="tabelle"/> tabellenOrGrafikLinks<br />
<input name="tabellenOrGrafikLinks" type="radio" value="grafik" /> tabellenOrGrafikLinks<br />
<h1 id="seitentyp" >Seitentyp</h1>
<input name="seitentyp" type="radio" value="seitentyp0"/> seitentyp0<br />
<input name="seitentyp" type="radio" value="seitentyp1" /> seitentyp1<br />
<input name="seitentyp" type="radio" value="seitentyp2" /> seitentyp2<br /><button type="submit" style="font-size: 9pt">Eingabe prüfen</button>
</form>
<hr/><script type="text/javascript">
var felder = ["tabellenOrGrafikLinks", "seitentyp", "themaID"];
</script>
</body></html>und in meinem Test wird in dieser Seite von der check()-Methode bemängelt, dass das "text"-Feld themaID angeblich _nicht_ gefüllt ist, obwohl das Feld nicht leer war. Also scheint die Überprüfung
if (
(feldgruppe[j].type == "text" && feldgruppe[j].value != "") ||
feldgruppe[j].checked
) {
auswahlGetroffen = true;
}in deiner Lösung den gleichen Manko haben, wie meine ursprüngliche Variante? ;-) Und ohne zweite Schleife kann man die Überprüfung nicht umsetzen?
gruss
Danke fürs MitmachenGustav
-
Hallo,
und in meinem Test wird in dieser Seite von der check()-Methode bemängelt, dass das "text"-Feld themaID angeblich _nicht_ gefüllt ist, obwohl das Feld nicht leer war. Also scheint die Überprüfung
if (
(feldgruppe[j].type == "text" && feldgruppe[j].value != "") ||
feldgruppe[j].checked
) {
auswahlGetroffen = true;
}in deiner Lösung den gleichen Manko haben, wie meine ursprüngliche Variante? ;-)
Nein. Der Fehler liegt woanders. Bei text-Eingabefeldern steigt er erst gar nicht in die innere for-Schleife ein. Muss er ja auch nicht, es gibt ja nur ein Feld pro Namen (name) bei Texteingabefeldern. feldgruppe.length ist undefined, weil es sich eben um keine Collection von Radio-Optionen handelt. Dann fragt man halt ab, ob feldgruppe ein Elementknoten oder eine Collection von Elementknoten ist. Da gibt es wahrlich dutzende Möglichkeiten. Eine davon habe ich schon aufgezeigt (Unterscheidung nach type oder value). Eine andere nach feldgruppe.length sähe eingebaut dann so aus:
for (var i = 0; i < felder.length; i++) {
var auswahlGetroffen = false;
feldgruppe = document.forms[formularobjekt.name].elements[ felder[i] ];
if (feldanzahl=feldgruppe.length) { // oder typeof(feldgruppe.length)!='undefined' oder umgekehrt if (feldgruppe.type && feldgruppe.type=="text") oder, oder, oder...
// falls es sich um Radiooptionen handelt, durchlaufe die Felder:
for (var j = 0; j < feldanzahl; j++) {
if (feldgruppe[j].checked) {
auswahlGetroffen = true;
}
}
} else {
// falls es sich um ein Texteingabefeld handelt
if (feldgruppe.value != "") {
auswahlGetroffen = true;
} // ... andere Feldarten können nach demselben Schema berücksichtigt werden
}
...
}Und ohne zweite Schleife kann man die Überprüfung nicht umsetzen?
Du musst nur an der richtigen Stelle eine Fallunterscheidung einbauen, die zwischen Radio-Feldern und Text-Feldern unterscheidet. Dies kann *in* der Schleife passieren, insofern sind keine zwei Schleifen notwendig. Das hättest du erkannt, wenn du meinen Code untersucht hättest.
Verzeihung, aber wenn ich dir schon eine Vorlage liefere, welche den Punkt herausarbeitet, über den deine Frage gelöst werden kann, dann kannst du den verbleibenden Fehler wenigstens selbst suchen. Ich will hier nicht ständig fertigen Code posten.Mathias
-
-