Kombination ANKER und ONSUBMIT
DerNordBerliner
- javascript
Mahlzeit,
gibt es eine Möglichkeit die Abfrage:
<script type="text/javascript">
function CheckInput () {
for (i = 0; i < document.forms[0].elements.length; ++i)
if (document.forms[0].elements[i].value == "") {
alert("Bitte eingeben 3!");
document.forms[0].elements[i].focus();
return false;
}
return true;
}
</script>
mit dem entsprechenden Buttom:
<input value="Zur Seite 4" type="submit">
so zu kombinieren, das keine neue Seite wie jetzt aufgerufen wird, sondern das zu einem angegebenen Anker auf der selben Seite gesprungen wird?
Ich habe versucht die Eingabe:
<a href="#anfang"></a>
irgend wie unterzubringen, ist mir aber nicht gelungen.
Gruß vom Markus
Wenn Du das Formular absenden willst, wird automatisch eine neue Seite angefordert. Wenn Du es nicht absenden willst, warum nimmst Du einen Submit-Button?
Solltest Du übrigens das Formular absenden wollen, ohne eine neue Seite zu laden, bleibt Dir nur der Weg über den XMLHttpRequest.
Gruß, LX
Hallöchen,
Grundidee war mit dem Buttom abzufragen ob alle Felder ausgefüllt wurden und wenn ja, dann ein neues Formular aufzurufen. Da ich aber beim Schreiben eine neue Idee hatte, wollte ich jetzt alle Formulare in einem body schreiben die in einem Fenster eingefügt werden, welches genau die Größe einer Seite hat. Erst wenn in diesem Fenster alle Felder ausgefüllt wurden, soll über die Abfrage weitergesprungen werden.
Vielleicht bin ich ja auch völlig falsch im Denken aber nunja.
Gruß vom Markus
wollte ich jetzt alle Formulare in einem body schreiben die in einem Fenster eingefügt werden, welches genau die Größe einer Seite hat. Erst wenn in diesem Fenster alle Felder ausgefüllt wurden, soll über die Abfrage weitergesprungen werden.
Du meinst, die Formulare befinden sich alle in einem Dokument, sind aber nacheinander sichtbar?
Dann solltest du mit einem Formular arbeiten, das aus mehreren Teilen besteht. Die JavaScript-Funktion prüft dann auch nicht das ganze Formular, sondern nur jeweils die Formularelemente in dem jeweiligen Abschnitt. Wenn die okay sind, wird der nächste eingeblendet. Wenn der letzte Abschnitt ausgefüllt ist, kann das Formular schließlich normal abgesendet werden und alle Daten werden zum Server gesendet (wenn nötig).
Soweit die Theorie. Wie weit bist du schon bei der Umsetzung?
Mathias
Hallo Mathias,
also, ich hatte die einzelnen Formulare schon fertig. Dann kam mir eben diese Idee mit der Kombination alle Formulare in einem zu kombinieren aber trotzdem die Abfrage stehen zu lassen. Smit sehen die ersten Zeilen also so aus:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>Seite1</title> <script type="text/javascript"> function CheckInput () { for (i = 0; i < document.forms[0].elements.length; ++i) if (document.forms[0].elements[i].value == "") { alert("Bitte füllen Sie alle Felder mit dem Zusatz P aus!"); document.forms[0].elements[i].focus(); return false; } return true; } </script> </head> <body>
<a name="Seite1"><id="Seite1"></a> <form action="#Seite2" onsubmit="return CheckInput();"> <center> <font size="+1"><b>Angebot für Schulprojekte im Rahmen des ESF-Landes-Programs</font></b><br> <font size="+1"><b>"Initiative Oberschule" (IOS) für das Schuljahr 2009-2010</b></font><br> Seite 1</center><br> <h3 style="font-family: Helvetica,Arial,sans-serif;color:#FFFFFF;background-color:#12458C">1. Angaben zur Schule </h3> <pre><table border="0" cellpadding="5" cellspacing="0"> <tbody><tr> <td align="right">1.1</td><td align="right">Name der Schule:</td><td><input maxlength="40" size="60" name="Schulname" type="text"></td><td>P</td></tr> <tr><td align="right">1.2</td><td align="right">Schulnummer:</td><td><input maxlength="10" size="20" name="Schulnummer" type="text"></td><td>P</td></tr> <tr><td align="right">1.3</td><td align="right">Postleitzahl:</td><td><input maxlength="5" size="10" name="PLZ" type="text"></td><td>P</td></tr> <tr><td></td><td align="right">Schulamt:</td><td><select name="Schulamt" size="1"><option>Bitte auswählen---></option><option value="Eberswalde">Eberswalde</option><option value="Frankfurt/Oder">Frankfurt/Oder</option><option value="Potsdam">Potsdam</option><option value="Perleberg">Perleberg</option><option value="Cottbus">Cottbus</option><option value="Wünsdorf">Wünsdorf</option></select></td><td>P</td></tr> <tr><td align="right">1.4</td><td align="right">Ort:</td><td><input maxlength="50" size="60" name="Ort" type="text"></td><td>P</td></tr><tr><td align="right">1.5</td><td align="right">Strasse + Nr:</td><td><input maxlength="50" size="60" name="Strasse" type="text"></td><td>P</td></tr> <tr><td align="right">1.6</td><td align="right">Telefon (Vorwahl/Durchwahl):</td><td><input maxlength="10" size="10" name="VWSchule" type="text"> / <input size="40" name="TelSchule" type="text"></td><td>P</td></tr> <tr><td></td><td align="right">Fax (Vorwahl/Rufnummer):</td><td><input maxlength="10" size="10" name="VWFax" type="text"> / <input size="40" name="FaxSchule" type="text"></td><td>P</td></tr> <tr><td align="right">1.7</td><td align="right">Dienst-E-Mail:</td><td><input value="xxxxxxxxxx@schulen.brandenburg.de" size="60" name="MailSchule" type="text"></td><td>P</td></tr> <tr><td align="right">1.8</td><td colspan="2" align="left">Unterschriftsberechtigte Person (i.d.R. Schulleiter/in):</td></tr> <tr><td></td><td align="right">Anrede</td><td><select name="Anrede1" size="1"><option>Bitte auswählen---></option><option value="Frau">Frau</option><option value="Herr">Herr</option></select>P <font size="-3"> Bitte auswählen: </font><select name="Titel" size="1"><option>Bitte auswählen---></option><option value="kein Eintrag">kein Eintrag<option value="Prof.">Prof.</option><option value="Dr.">Dr.</option></select></td><td>P</td></tr> <tr><td></td><td align="right">Vorname Nachname:</td><td><input size="25" name="Vorname1" type="text"> <input size="25" name="Nachname1" type="text"></td><td>P</td></tr> <tr><td></td><td align="right">Funktion:</td><td><input size="60" name="Funktion1" type="text"></td><td>P</td></tr> </tbody></table><br> <h3 style="font-family: Helvetica,Arial,sans-serif; font-weight: bold;color:#FFFFFF;background-color:#12458C">1a. Gibt es weitere Kooperationsschulen im Rahmen des Projektes? <input name="Schule2" value="Ja" type="radio"> Ja <input name="Schule2" value="Nein" type="radio">Nein <center><input value="Zur Seite 2" type="submit"></pre></center> </form> <a name="Seite2"></a> <form action="#Seite3" onsubmit="return CheckInput();"> <center> <font size="+1"><b>Angebot für Schulprojekte im Rahmen des ESF-Landes-Programs</font></b><br> <font size="+1"><b>"Initiative Oberschule" (IOS) für das Schuljahr 2009-2010</b></font><br> Seite 2</center><br> <h3 style="font-family: Helvetica,Arial,sans-serif;color:#FFFFFF;background-color:#12458C">2. Angaben zum Leistungserbringer </h3> <pre><table border="0" cellpadding="5" cellspacing="0"> <tbody><tr> <td align="right">2.1</td><td align="right">Name des Leistungserbringers:</td><td><input maxlength="40" size="60" name="LeisName" type="text"></td><td>P</td></tr> <tr><td align="right">2.2</td><td align="right">Rechtsform:</td><td><input maxlength="40" size="60" name="LeisForm" type="text"></td><td>P</td></tr> <tr><td align="right">2.3</td><td align="right">Postleitzahl:</td><td><input maxlength="5" size="10" name="LeisPLZ" type="text"></td><td>P</td></tr> <tr><td align="right">2.4</td><td align="right">Ort:</td><td><input maxlength="50" size="60" name="LeisOrt" type="text"></td><td>P</td></tr><tr><td align="right">2.5</td><td align="right">Strasse + Nr:</td><td><input maxlength="50" size="60" name="LeisStrasse" type="text"></td><td>P</td></tr> <tr><td align="right">2.6</td><td align="right">Telefon (Vorwahl/Durchwahl):</td><td><input maxlength="10" size="10" name="LeisVW" type="text"> / <input size="40" name="LeisTel" type="text"></td><td>P</td></tr> <tr><td></td><td align="right">Fax (Vorwahl/Rufnummer):</td><td><input maxlength="10" size="10" name="LeisVWFax" type="text"> / <input size="40" name="LeisFax" type="text"></td><td>P</td></tr> <tr><td align="right">2.7</td><td align="right">E-Mail:</td><td><input size="60" name="LeisMail" type="text"></td><td>P</td></tr> <tr><td align="right">2.8</td><td colspan="2" align="left">Unterschriftsberechtigte Person (i.d.R. Geschäftsführer/in, Vereinsvorsitzende/r):</td></tr> <tr><td></td><td align="right">Anrede</td><td><select name="LeisAnrede" size="1"><option>Bitte auswählen---></option><option value="Frau">Frau</option><option value="Herr">Herr</option></select> P <font size="-3"> Bitte auswählen: </font><select name="LeisTitel" size="1"><option>Bitte auswählen---></option><option value="kein Eintrag">kein Eintrag<option valur="Prof.">Prof.</option><option value="Dr.">Dr.</option></select></td><td>P</td></tr> <tr><td></td><td align="right">Vorname Nachname:</td><td><input size="25" name="LeisVorname" type="text"> <input size="25" name="LeisNachname" type="text"></td><td>P</td></tr> <tr><td></td><td align="right">Funktion:</td><td><input size="60" name="LeisFunktion" type="text"></td><td>P</td></tr> </tbody></table><br><br>
<h3 style="font-family: Helvetica,Arial,sans-serif; font-weight: bold;color:#FFFFFF;background-color:#12458C">3. Ansprechpartner beim Leistungserbringer für den IOS-Regionalpartner</h3> <table border="0" cellpadding="5" cellspacing="0"> <tbody> <tr><td align="right">3.1</td><td align="left">Name der Ansprechperson:</td></tr> <tr><td></td><td align="right">Anrede</td><td><select name="Anrede3" size="1"><option>Bitte auswählen---></option><option value="Frau">Frau</option><option value="Herr">Herr</option></select> P <font size="-3"> Bitte auswählen: </font><select name="Titel3" size="1"><option>Bitte auswählen---></option><option value="kein Eintrag">kein Eintrag<option value="Prof.">Prof.</option><option value="Dr.">Dr.</option></select></td><td>P<td></tr> <tr><td align="right"></td><td align="right">Vorname Nachname:</td><td><input size="25" name="Vorname3" type="text"> <input size="25" name="Nachname3" type="text"></td><td>P</td></tr> <tr><td></td><td align="right">Funktion:</td><td><input size="60" name="Funktion3" type="text"></td><td>P</td></tr> <tr><td align="right">3.2</td><td align="right">Postleitzahl:</td><td><input maxlength="5" size="10" name="PLZ3" type="text"></td><td>P</td></tr> <tr><td align="right">3.3<td align="right">Ort:</td><td><input maxlength="50" size="60" name="LeisOrt3" type="text"></td><td>P</td></tr> <tr><td align="right">3.4</td><td align="right">Strasse + Nr:</td><td><input maxlength="50" size="60" name="LeisStrasse3" type="text"></td><td>P</td></tr> <tr><td align="right">3.5</td><td align="right">Telefon (Vorwahl/Durchwahl):</td><td><input maxlength="10" size="10" name="LeisVW2" type="text"> / <input size="40" name="LeisTel2" type="text"></td><td>P</td></tr> <tr><td></td><td align="right">Fax (Vorwahl/Rufnummer):</td><td><input maxlength="10" size="10" name="LeisVW2" type="text"> / <input size="40" name="LeisFax2" type="text"></td><td>P</td></tr> <tr><td align="right">3.6</td><td align="right">E-Mail für Rückfragen:</td><td><input size="60" name="LeisMail2" type="text"></td><td>P</td></tr> <tr><td align="right">3.7</td><td align="left">Bankverbindung</td></tr> <tr><td></td><td align="right">Name des Geldinstitutes</td><td><input maxlength="50" size="60" name="Bank" type="text" </td><td>P</td></tr> <tr><td></td><td align="right">Bankleitzahl</td><td><input maxlength="10" size="50" name="BLZ" type="text" </td><td>P</td></tr> <tr><td></td><td align="right">Kontonummer</td><td><input maxlength="10" size="20" name="Konto" type="text" </td><td>P</td></tr> <tr><td></td><td align="right">Kontoinhaber</td><td><input maxlength="50" size="60" name="Inhaber" type="text" </td><td>P</td></tr> </tbody></table><br><br> <center> <input value="Zur Seite 3" type="submit"> </pre></center> </form> </body> </html>
Aufgerufen wird die Seite in einem Fenster:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html> <head> <meta http-equiv="content-type" content="text/html; charset=ISO-8859-1"> <title>Angebot für Schulprojekte 2009 - 2010 (IOS)</title> <meta name="DC.Language" content="de"> <link rel="stylesheet" type="text/css" href="styles.css"> </head>
<body text="#000000" bgcolor="#FFFFFF" link="#000000" alink="#000000" vlink="#000000"> <font size="-1">Initiative Oberschule</font><br> <center><font size="+3"><b><u>Angebotsformular</u></b></font></center> <br>
<table > <tr> <td></td> </tr> <tr> <td><img align="right" src="Leer.gif" width="5" height="8" alt="" border=""></td><td><img src="17c0aec209.gif" width="105" height="88" border="0" alt=""><img src="MBJS-Logo.jpg" width="95" height="69" border="0" alt=""><img src="Logo-ESF.jpg" width="129" height="67" border="0" alt=""> </td> <td></td> <td></td> <td></td> <td><img align="right" src="Leer.gif" width="250" height="88" alt="" border=""></td> <td><img align="right" src="Tabelle.gif" alt="" border=""> </td> </tr> </table> <br><br> <center> <font color="#FF0000" size="-1">Bitte füllen Sie alle Felder mit dem Zusatz "P" aus, um unnötige Rückfragen zu vermeiden!<br> Das Anzeigen von aktiven Inhalten (Skripts, ActiveX-Steuerelementen) muss freigeschaltet sein.<br> Bitte beantworten Sie einen eventuellen Sicherheitshinweis mit "Ja".</font> <iframe src="Start.html" scrolling="no" name="Fenster" width="800" height="1200" marginheight="1" marginwidth="1" align="center"> <p>Ihr Browser kann leider keine eingebetteten Frames anzeigen</p> </iframe>
</body> </html>
Das Formular erscheint also im Fesnter welches genau die Größe bis zum 1. Buttom hat. Wenn jetzt auf selbigem geklickt wird, soll überprüft werden, ob jedes Feld ausgefüllt wurde und wenn ja,soll da Formular weiterrutschen.
Ganz zum Schluss (es sind 12 Seiten) soll die Möglichkeit des Ausdrucks und des Absendens erfolgen. Mehr will ich nicht, puh.
Gruß Markus
Hellihello
wenn Du dem submit einen onclick-Event zuordnest, wird das HTML-Ziel nur dann angepeilt, wenn die onclick-Funktion true zurückliefert.
Das Problem lässt sich also aufsplitten, denn der onclick-event liefert entweder false, dann passiert auch nix weiter, oder true, dann passiert das, was auch ohne onclick passiert wäre.
Dank und Gruß,
function CheckInput () {
<input value="Zur Seite 4" type="submit">
so zu kombinieren, das keine neue Seite wie jetzt aufgerufen wird, sondern das zu einem angegebenen Anker auf der selben Seite gesprungen wird?
Was genau hast du vor? Wann soll zum Anker gesprungen werden? Wenn keine Fehler im Formular gefunden wurden und die Prüffunktion true zurückgibt?
Ein Formular dient zur Übertragung von Daten an den Server. Willst du das denn? Der Server antwortet üblicherweise, indem er ein anderes HTML-Dokument zurückliefert. Willst du, dass das Formular quasi im Hintergrund übermittelt wird, das aktuelle Dokument aber nicht ausgetauscht wird?
Bitte erkläre die Sache mal umfassender - was hat es mit dem Formular und dem Ankersprung auf sich?
Mathias
Hi,
Mahlzeit,
Auch hier siehst du, warum du keine Doppelpostings machen solltest - waerst du in deinem bestehenden Thread geblieben, dann haetten auch nicht so viele Leute rueckfragen muessen, was du eigentlich vorhast und erreichen willst.
MfG ChrisB