Antwortformular mit JavaScript kontrollieren ?

[bari]

Guten Tag,

letzthin las man mehrere postings, in denen gesagt wurde, dass JavaScript-Formulare in html-Dokumenten nichts zu suchen hätten. Gilt das auch für die Kontrolle, ob ein Eingabefeld ausgefüllt worden ist ? Und wenn ja, wo finde ich ein html-pendant dazu ?

Gruss
bari.

[Der Martin]

Hallo,

letzthin las man mehrere postings, in denen gesagt wurde, dass JavaScript-Formulare in html-Dokumenten nichts zu suchen hätten.

ws verstehst du unter Javascript-Formularen?

Gilt das auch für die Kontrolle, ob ein Eingabefeld ausgefüllt worden ist ? Und wenn ja, wo finde ich ein html-pendant dazu ?

Sagen wir's mal so: Die Überprüfung der Eingaben mit Javascript ist ganz nett; HTML 5 stellt auch Attribute für Formularfelder zur Verfügung, die eine grundlegende Validierung bieten. Aber all das ist eine rein clientseitige Überprüfung - du kannst dich also nicht darauf verlassen, dass sie stattfindet, und wenn, kann sie dennoch manipuliert sein. Eine Überprüfung auf der Serverseite, wo die Daten letztendlich verarbeitet werden, ist also sowieso Pflicht.

Und damit hat die clientseitige Prüfung, egal auf welche Weise, nur noch den Charakter einer Komfort-Maßnahme, weil sie eventuell ein unnötiges Abschicken des fehlerhaft ausgefüllten Formulars erspart.

So long,
 Martin

PS: Du plenkst. Ist aber heilbar, habe ich gehört.

[bari]

hallo Martin,

ws verstehst du unter Javascript-Formularen?

eigentlich nur die mit Javascript geschriebenen/kopierten Kontrollfensterchen, die erscheinen, wenn man bei einem Eingabefenster keine Eingabe gemacht hat und das Formular absenden möchte.

Gilt das auch für die Kontrolle, ob ein Eingabefeld ausgefüllt worden ist ? Und wenn ja, wo finde ich ein html-pendant dazu ?

Sagen wir's mal so: Die Überprüfung der Eingaben mit Javascript ist ganz nett; HTML 5 stellt auch Attribute für Formularfelder zur Verfügung, die eine grundlegende Validierung bieten. Aber all das ist eine rein clientseitige Überprüfung - du kannst dich also nicht darauf verlassen, dass sie stattfindet, und wenn, kann sie dennoch manipuliert sein. Eine Überprüfung auf der Serverseite, wo die Daten letztendlich verarbeitet werden, ist also sowieso Pflicht.

Wenn jemand manipulieren will, ist mir das letztlich egal, da bin ich sowieso hilflos. Ich möchte aber denjenigen, die ein Formular ordentlich ausfüllen und Absenden wollen, es so einfach und doch so nützlich wie möglich machen.

Und damit hat die clientseitige Prüfung, egal auf welche Weise, nur noch den Charakter einer Komfort-Maßnahme, weil sie eventuell ein unnötiges Abschicken des fehlerhaft ausgefüllten Formulars erspart.

es kann ja passieren, dass man irgendwo ungewollt draufklickt und schon ist es weg. In diesem Sinne auch so sicher/komfortabel wie möglich.

Ist in diesem Sinne mein Antwortformular mit Javascript im head i. O.(ausser den untersten 3 Zeilen (Zeilen 34-37 in der Firebug-html-Anzeige), die nichts nützen; ich versteh noch nichts oder nicht viel von Javascript)?

Besten Dank,
bari.

PS: Du plenkst. Ist aber heilbar, habe ich gehört.

wieso, wird das als Krankheit angesehen? ;-) - Manchmal finde ich das ganz gut, vor einem ? oder ! ein Leerschlag einzufügen, besonders wenn die Schrift gross und noch gespaced ist. Mir scheint das allgemeine Erscheinungsbild dadurch schöner/harmonischer, aber konsequenterweise müsste ich dann einen nbsp einfügen - habe ich dem Französischen abgeschaut.

[Der Martin]

Hi,

Wenn jemand manipulieren will, ist mir das letztlich egal, da bin ich sowieso hilflos. Ich möchte aber denjenigen, die ein Formular ordentlich ausfüllen und Absenden wollen, es so einfach und doch so nützlich wie möglich machen.

ja, das ist auch völlig okay. Ich wollte nur daran erinnern, dass man sich nie auf gültige Eingaben verlassen darf, nur weil man beim Client schon eine Überprüfung vorgesehen hat.

es kann ja passieren, dass man irgendwo ungewollt draufklickt und schon ist es weg. In diesem Sinne auch so sicher/komfortabel wie möglich.

ACK. Nur nicht vergessen, die ankommenden Daten trotzdem zu überprüfen.

Ist in diesem Sinne mein Antwortformular mit Javascript im head i. O.

Würde ich beim flüchtigen Drüberschauen schon sagen, ja. Du prüfst alle Felder daraufhin, ob sie leer gelassen wurden, und im e-Mail-Feld verlangst du zwingend das Vorhandensein eines '@'. Das erscheint mir plausibel.
Seltsam finde ich allerdings, dass du das Feld für den Vornamen mit "user" benennst, und das für den Wohnort mit "URL"; mir gefällt auch nicht, dass du für die Beschriftung der Eingabefelder semantisch neutrale span-Elemente verwendest, anstatt die dafür vorgesehenen label-Elemente.

(ausser den untersten 3 Zeilen (Zeilen 34-37 in der Firebug-html-Anzeige), die nichts nützen; ich versteh noch nichts oder nicht viel von Javascript)?

Das versteh *ich* jetzt wieder nicht. Was soll da nichts nützen? - Okay, es sind zwei redundante Abfragen drin. Wenn du prüfst, ob im e-Mail-Feld mindestens ein '@' vorkommt, ist die Prüfung davor überflüssig, ob das Feld leer ist. Wenn es leer ist, enthält es nämlich auch kein '@'. ;-)

PS: Du plenkst. Ist aber heilbar, habe ich gehört.
wieso, wird das als Krankheit angesehen? ;-)

Von mir schon. *g*

Manchmal finde ich das ganz gut, vor einem ? oder ! ein Leerschlag einzufügen, besonders wenn die Schrift gross und noch gespaced ist. Mir scheint das allgemeine Erscheinungsbild dadurch schöner/harmonischer, aber konsequenterweise müsste ich dann einen nbsp einfügen - habe ich dem Französischen abgeschaut.

Ich weiß, dass das im Französischen normal und richtig ist; ich find's dennoch hässlich. Und falsch ist es im Deutschen außerdem.

Schönen Sonntag noch,
 Martin

[bari]

Hello,
Vielen Dank für deine Erklärungen.

ACK. Nur nicht vergessen, die ankommenden Daten trotzdem zu überprüfen.

mir werden die Emails weitergeleitet. Meinst du, die Daten in den Emails (die schaue ich dann ja sowieso an, um zu wissen was jemand möchte) oder meinst du serverseitig eine Plausibilitätskontrolle?

Ist in diesem Sinne mein Antwortformular mit Javascript im head i. O.

Seltsam finde ich allerdings, dass du das Feld für den Vornamen mit "user" benennst, und das für den Wohnort mit "URL"; mir gefällt auch nicht, dass du für die Beschriftung der Eingabefelder semantisch neutrale span-Elemente verwendest, anstatt die dafür vorgesehenen label-Elemente.

das fand ich auch etwas seltsam und weiss nicht mehr genau, woher ich es habe. Aber ich glaube, nach flüchtigem Uberblicken des Abschnitts Label für Elemente" im selfhtml das Richtige gefunden zu haben. Das Layout meiner Tabelle gefällt mir nämlich noch nicht (unterschiedlicher Beginn der Zeile links z.B.). Schaue das an.

(ausser den untersten 3 Zeilen (Zeilen 34-37 in der Firebug-html-Anzeige), die nichts nützen; ich versteh noch nichts oder nicht viel von Javascript)?

Das versteh *ich* jetzt wieder nicht. Was soll da nichts nützen? - Okay, es sind zwei redundante Abfragen drin. Wenn du prüfst, ob im e-Mail-Feld mindestens ein '@' vorkommt, ist die Prüfung davor überflüssig, ob das Feld leer ist. Wenn es leer ist, enthält es nämlich auch kein '@'. ;-)

ich meine diesen Code (die letzten paar Zeilen des Javascripts):
function ResetCheck () {
var chk = reset.confirm("Möchten Sie wirklich alle Eingaben löschen ?");
return (chk);
}
mit dem wollte ich ein versehentliches Löschen der eingegebenen Daten verhindern, v.a. wenn es bereits ein langer Text ist (war mir eben zum Ärger schon manchmal passiert ist). Somit hat man zumindest noch die Möglichkeit, den Text zu kopieren und wieder einzusetzen.
D.h. sobald man auf löschen drückt, soll ein Fenster den Vorgang nochmals ausdrücklich verlangen (bezieht sich natürlich auf irgendein Feld oder mehrere/alle Felder aufs Mal). Ich weiss aber nicht, ob das richtig geschrieben ist, da es nicht funktionierte, als ich es einmal ausprobierte, d.h. der Löschvorgang wurde direkt ausgeführt.

Gruss
bari.

[Der Martin]

Hallo,

ACK. Nur nicht vergessen, die ankommenden Daten trotzdem zu überprüfen.
mir werden die Emails weitergeleitet. Meinst du, die Daten in den Emails (die schaue ich dann ja sowieso an, um zu wissen was jemand möchte) oder meinst du serverseitig eine Plausibilitätskontrolle?

ich meine nur, du solltest dir genau überlegen, was für unerwünschte Dinge da passieren könnten, wenn Eingaben ankommen, die nicht dem erwarteten Muster entsprechen. Landen beispielsweise Eingaben in Mail-Headern, die dann negative Folgen haben könnten?
Dagegen, dass jemand bewusst Müll einträgt, kannst du nichts machen. Du musst nur dafür sorgen, dass der normale Betrieb dadurch nicht gestört wird.

(ausser den untersten 3 Zeilen (Zeilen 34-37 in der Firebug-html-Anzeige), die nichts nützen; ich versteh noch nichts oder nicht viel von Javascript)?
Das versteh *ich* jetzt wieder nicht. Was soll da nichts nützen? [...]
ich meine diesen Code (die letzten paar Zeilen des Javascripts):
function ResetCheck () {
var chk = reset.confirm("Möchten Sie wirklich alle Eingaben löschen ?");
return (chk);
}

Ach das. Das habe ich doch beim ersten Drüberschauen völlig übersehen. Ähm, ja. Diese Zeilen sind insofern sinnlos, als dass die Funktion nie aufgerufen wird. Und das ist gut so, denn andernfalls würde diese Anweisung ...

var chk = reset.confirm("Möchten Sie wirklich alle Eingaben löschen ?");

... eine Javascript-Fehlermeldung werfen. Oder hast du ein globales Objekt mit dem Namen "reset"? Wenn ja, woher? Und warum sollte es über eine Methode confirm() verfügen, die noch dazu der gleichnamigen Methode des window-Objekts zu gleichen scheint?

mit dem wollte ich ein versehentliches Löschen der eingegebenen Daten verhindern, v.a. wenn es bereits ein langer Text ist (war mir eben zum Ärger schon manchmal passiert ist). Somit hat man zumindest noch die Möglichkeit, den Text zu kopieren und wieder einzusetzen.

Da würde ich doch lieber auf den RESET-Button verzichten. Der ist meiner Ansicht nach völlig überflüssig.

So long,
 Martin

[bari]

Hallo Martin,
Besten Dank für die Ergänzungen.

Dagegen, dass jemand bewusst Müll einträgt, kannst du nichts machen. Du musst nur dafür sorgen, dass der normale Betrieb dadurch nicht gestört wird.

ich weiss jetzt nicht recht, ob ich noch weiter fragen soll, ich hab keine Ahnung von solchen Dingen. Hast du allenfalls ein Beispiel? Vielleicht könnten Emails an eine andere Emailadresse umgeleitet werden, oder etwa einen Virus mitgeliefert?

Da würde ich doch lieber auf den RESET-Button verzichten. Der ist meiner Ansicht nach völlig überflüssig.

gut, ist natürlich auch wahr und einfacher.

Gruss,
bari.

[Der Martin]

Hallo,

Dagegen, dass jemand bewusst Müll einträgt, kannst du nichts machen. Du musst nur dafür sorgen, dass der normale Betrieb dadurch nicht gestört wird.
ich weiss jetzt nicht recht, ob ich noch weiter fragen soll, ich hab keine Ahnung von solchen Dingen. Hast du allenfalls ein Beispiel?

sogar zwei Klassiker.

1. Man setzt GET- oder POST-Parameter ungeprüft in ein SQL-Statement ein. Du erwartest vielleicht einen harmlosen Benutzernamen, ein böswilliger Kandidat übergibt dir aber einen String, der, in ein SQL-Statement eingefügt, auch wieder ein gültiges, aber verändertes Statement ergibt. Noch nie die Geschichte vom kleinen Bobby Tables gelesen?

2. Du erlaubst dem Besucher in einem Anfrageformular, den Betreff für die generierte Mail selbst einzutragen. Anstatt "Problem beim Login" übergibt er dir nun den String "foo\r\nCC: [e-mail], [e-mail]". Und schon hast du eine hübsche kleine Spamschleuder.

Ciao,
 Martin

[bari]

Guten Abend Martin,

sogar zwei Klassiker.

1. Man setzt GET- oder POST-Parameter ungeprüft in ein SQL-Statement ein. Du erwartest vielleicht einen harmlosen Benutzernamen, ein böswilliger Kandidat übergibt dir aber einen String, der, in ein SQL-Statement eingefügt, auch wieder ein gültiges, aber verändertes Statement ergibt. Noch nie die Geschichte vom kleinen Bobby Tables gelesen?

nein, kenne ich bisher noch nicht.

2. Du erlaubst dem Besucher in einem Anfrageformular, den Betreff für die generierte Mail selbst einzutragen. Anstatt "Problem beim Login" übergibt er dir nun den String "foo\r\nCC: [e-mail], [e-mail]". Und schon hast du eine hübsche kleine Spamschleuder.

Besten Dank für die Beispiele.

Gruss
bari.