Kontakformular
lima-city → Forum → Die eigene Homepage → HTML, CSS & Javascript
anrede
attribut
code
datum
deutschland
extra
formular
frau
herr
http
kontakt
land
modell
nachricht
sinn
solaranlage
telefon
typ
url
vorname
-
Guten Abend,
ich steh so etwas auf dem Schlau versuch schon den ganzen Tag ein Formular zu erstellen das funktioniert, anständig aussieht und und und....
Jetzt bin ich so fertig irgendwie klappt gar nix.
Ich möchte ein Formular an meine Email Adresse schicken dies muss ja in .php geschrieben sein, nur bin ich gerade zu blöd draufzukommen wie ich das auf meine HP bekomme.
Wenn sich jemand die mühe machen würde mir das zu erklären, ich hoffe ich bekomm das heut noch hin sonnst sollt ich doch langsam ins Bett.
Hoffentlich versteht an überhaupt was ich will
Lieben Gruß Timon -
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage
-
EDIT:
Hab mich jetzt mal an einen Code versucht.
<h2>Bestellformular</h2> <form action="senden.php" target="_kontakt" method="post"> <table> <p>Anrede:</p> <select name="top5" size="1"> <option>Frau</option> <option>Herr</option> <option>Dr.</option> <option>Prof.</option> </select> <form action="input_text.htm"> <p>Vorname:<br><input name="vorname" type="text" size="30" maxlength="30"></p> <p>Name:<br><input name="zuname" type="text" size="30" maxlength="40"></p> <p>Strasse/Nr.:<br><input name="vorname" type="text" size="30" maxlength="30"></p> <p>PLZ:<br><input name="zuname" type="text" size="10" maxlength="40"></p> <p>Ort:<br><input name="vorname" type="text" size="30" maxlength="30"></p> <p>Telefon Nr.:<br><input name="zuname" type="text" size="30" maxlength="40"></p> </form> <p>Ihre E-Mailadresse.</p> <input type="text" name="emailadresse" maxlength="64" size="40"> <p>Land</p> <select name="top5" size="1"> <option selected>Deutschland</option> <option>Holland</option> <option>Schweiz</option> <option>Oesterreich</option> <option>Sonstiges</option> </select> </p> <p>Modell:</p> <form action="input_radio.htm"> <p> <input type="radio" name="Modell" value="Modell 1"> Typ 1<br> <input type="radio" name="Modell" value="Modell 2"> Typ 2<br> </p> </form> <p>Extras:</p> <form action="input_checkbox.htm"> <p> <input type="checkbox" name="extras" value="heizung"> Heizung<br> <input type="checkbox" name="extras" value="kuehlschrank"> Kühlschrank<br> <input type="checkbox" name="extras" value="solaranlage"> Solaranlage<br> <input type="checkbox" name="extras" value="tv"> TV mit DVD-Player<br> <input type="checkbox" name="extras" value="ersatz rad"> Ersatz Rad<br> <input type="checkbox" name="extras" value="pannenset"> Pannen Set<br> </p> </form> <p>Ihre Nachricht.</p> <td><textarea name="nachricht" cols="40" rows="9"></textarea></td></tr> <td><input type="Submit" value="verschicken"></td></tr> </table></form>
Was mir nicht gefällt ist das zwischen Name und Land zu viel Platz ist, wie kann ich das Professioneller anordnen?
Beitrag zuletzt geändert: 25.3.2010 23:00:16 von nano-riff -
Nur ein paar Anregungen, weil's mir gerade zu spät ist für eine komplette Lösung:
- Nur einen <form></form>-Abschnitt (d.h., Du hast im Moment lauter einzelne Formulare)
- Feldbeschriftungen über <label>
- Anordnung über <div> und <span> statt über Absätze (<p>) und Tabellen
- Formatierung über CSS
Das sind jetzt ein paar Schlagwörter, die Dir SelfHTML sicher gern näher erläutert ;)
Edith ergänzt zumindest ein klitzekleines Codebeispiel:
<head> <style type="text/css"> <!-- .label { display: block; } --> </style> </head> <body> <form action="senden.php" method="post" name="form1" id="form1"> <label for="vorname" class="label">Vorname</label> <input type="text" name="vorname" id="vorname" /> <label for="nachname" class="label">Nachname</label> <input type="text" name="nachname" id="nachname" /> </form> </body>
Beitrag zuletzt geändert: 26.3.2010 0:13:27 von tavern -
Hi tavern, danke
hab mit deinem Beispiel nichts anfangen können, wie du ja gesehen hast kann ich nur scrips von SelfHTML kombinieren.
Ich hab aber jetzt das ganze in ein Formular gestellt und die Tabellen/Absätze durch <div> ersetzt.
<h2>Bestellformular</h2> <form action="senden.php" target="_kontakt" method="post"> <table> <div> Anrede: <select name="anrede" size="1"> <option>Frau</option> <option>Herr</option> <option>Dr.</option> <option>Prof.</option> </select></div> <p> <action="kontakt"> <div><label>Vorname:<input name="vorname" type="text" size="30" maxlength="30"><br></label> <label>Name:<input name="zuname" type="text" size="30" maxlength="40"><br></label> <label>Strasse/Nr.:<input name="vorname" type="text" size="30" maxlength="30"><br></label> <label>PLZ:<input name="zuname" type="text" size="10" maxlength="40"><br></label> <label>Ort:<input name="vorname" type="text" size="30" maxlength="30"><br></label> <label>Telefon Nr.:<input name="zuname" type="text" size="30" maxlength="40"><br></label> <label>Ihre E-Mailadresse.</label> <input type="text" name="emailadresse" maxlength="64" size="40"></div> <div><label>Land</label> <select name="land" size="1"> <option selected>Deutschland</option> <option>Holland</option> <option>Schweiz</option> <option>Oesterreich</option> <option>Sonstiges</option> </select> </div> <br> <div><label>Modell:</label><br> <action="input_radio"> <input type="radio" name="modell" value="Modell 1"> Typ 1<br> <input type="radio" name="modell" value="Modell 2"> Typ 2<br> </div <br> <div><label>Extras:</label><br> <action="input_checkbox"> <input type="checkbox" name="extras" value="heizung"> Heizung<br> <input type="checkbox" name="extras" value="kuehlschrank"> Kühlschrank<br> <input type="checkbox" name="extras" value="solaranlage"> Solaranlage<br> <input type="checkbox" name="extras" value="tv"> TV mit DVD-Player<br> <input type="checkbox" name="extras" value="ersatz rad"> Ersatz Rad<br> <input type="checkbox" name="extras" value="pannenset"> Pannen Set<br> </div> <br> <label>Ihre Nachricht.</label> <td><textarea name="nachricht" cols="40" rows="9"></textarea></td></tr> <td><input type="Submit" value="verschicken"></td></tr> </table></form>
Ich hoffe nur das dies so richtig ist.
Nur was du mit Formatierung über CSS meinst versteh ich nicht.
Meinst du vielleicht das
<?php $anrede = (!empty($_POST['anrede'])) ? $_POST['anrede'] : $kontakt = (!empty($_POST['kontakt'])) ? $_POST['kontakt'] : $emailadresse = (!empty($_POST['emailadresse'])) ? $_POST['emailadresse'] : $land = (!empty($_POST['land'])) ? $_POST['land'] : $modell = (!empty($_POST['modell'])) ? $_POST['modell'] : $extras = (!empty($_POST['extras'])) ? $_POST['extras'] : 'timon.schaefer@hotmail.de'; $nachricht = (!empty($_POST['nachricht'])) ? $_POST['nachricht'] : ''; if ($nachricht == '') { echo 'Bitte geben Sie eine Nachricht ein.'; } else { mail('???????@???.de', '[Anfrage von der Website]', $nachricht, 'From: ' . $emailadresse . "\r\n"); echo 'Vielen Dank für Ihre Nachricht. Ich werden so bald wie möglich antworten.'; } ?>
Gruß Timon
-
Hi
ich glaube du hast die Verschachtelung und den Sinn der HTML-Elemente nicht so ganz drin.
Also kurz dazu mal:
Ein <form> Tag definiert ein gesamtes Formular BSP:
<form> Gesammtes Formular </form>
<fieldset> Dedifniert einen Bereich innerhalb des Formulars BSP:
<form><fieldset>Formularteil1</fieldset><fieldset>Formularteil2</fieldset></form>
Du brauchst min 1 <fieldset> um einen sauberen Code zu haben.
<legend> Gibt dem jeweiligen <fieldset> einen Titel BSP:
<form> <fieldset> <legend>Formulartitel 1</legend> Formularteil1 </fieldset> <fieldset> <legend>Formulartitel 2</legend> Formularteil2 </fieldset> </form>
<label> erzeugt einen Logischen Bezeichner für ein Eingabeelement, das heißt der Text der vorzugsweise _vor_ dem Eingabeelement steht, alternativ kann der Text natürlich auch dahinter stehn.
Ich hab dir dein Formular mal entsprechend umgebaut:
<form method="post" action="<?=$_SERVER["PHP_SELF"]?>"> <fieldset> <legend>Mein Formular</legend> <div> <label for="anrede">Anrede</label> <select name="anrede" size="1" id="anrede"> <option>Frau</option> <option>Herr</option> <option>Dr.</option> <option>Prof.</option> </select> </div> <div> <div> <label for="Vorname">Vorname:</label> <input type="text" maxlength="30" name="vorname" id="Vorname"/> </div> <div> <label for="Name">Name:</label> <input type="text" maxlength="30" name="name" id="Name"/> </div> <div> <label for="Strasse">Strasse:</label> <input type="text" maxlength="30" name="strasse" id="Strasse"/> </div> <div> <label for="PLZ">PLZ:</label> <input type="text" maxlength="30" name="plz" id="PLZ"/> </div> <div> <label for="Ort">Ort:</label> <input type="text" maxlength="30" name="ort" id="Ort"/> </div> <div> <label for="Telefon">Telefon:</label> <input type="text" maxlength="30" name="telefon" id="Telefon"/> </div> <div> <label for="Email">Ihre E-Mailadresse:</label> <input type="text" maxlength="30" name="email" id="Email"/> </div> </div> <div> <label for="Land">Land</label> <select name="land" size="1" id="Land"> <option selected="selected">Deutschland</option> <option>Holland</option> <option>Schweiz</option> <option>Oesterreich</option> <option>Sonstiges</option> </select> </div> <div> <div> <input type="checkbox" name="extras[]" value="heizung" id="Heizung"> <label for="Heizung">Heizung</label> </div> <div> <input type="checkbox" name="extras[]" value="kuehlschrank" id="Kuehlschrank"> <label for="Kuehlschrank">Kühlschrank</label> </div> <div> <input type="checkbox" name="extras[]" value="solaranlage" id="Solaranlage"> <label for="Solaranlage">Solaranlage</label> <label for="Ersatzrad">Ersatzrad</label> </div> </div> <div> <input type="checkbox" name="extras[]" value="tv" id="TV"> <label for="TV">TV</label> </div> <div> <input type="checkbox" name="extras[]" value="ersatzrad" id="Ersatzrad"> <div> <input type="checkbox" name="extras[]" value="pannenset" id="Pannenset"> <label for="Pannenset">Pannenset</label> </div> </div> <div> <label for="Nachrichten">Nachricht:</label> <textarea name="nachricht" cols="40" rows="9" id="Nachrichten"></textarea> </div> <div> <input type="submit" name="Senden" value="Abschicken" id="senden"/> </div> </fieldset> </form>
So glieder ich gerne mal meine Formulare.
Ich hoffe du weist was Arrays sind, die wirst du bei den Checkboxen benötigen, dir fällt sicher auf das der Name in den Checkboxen zwei eckige Klammern hat.
Ein Formular wird immer als Array abgeschickt und die Eckigen klammern erzeugen automatisch einen Nummerischen Index ( 0,1,2,3,...)
Wenn du den Code nun abschickst kannst du ihn in der Selben Datei auslesen dank <form action="<?=$_SERVER["PHP_SELF"]?>" method="post">
Schreibe dazu einfach vorzugsweise über das Formular (es geht auch unterhalb) folgenden Code:
<pre> <?=print_r($_POST)?> </pre>
Diese Anweisung, gibt dir alle Daten raus die du abgeschickt hast. Das <pre> Formatiert dir die Ausgabe schön ;)
ICh denke das reicht erstmal, alles andere kannst ja fragen.
Grüsse
Color
-
color schrieb:
Wenn du den Code nun abschickst kannst du ihn in der Selben Datei auslesen dank <form action="<?=$_SERVER["PHP_SELF"]?>" method="post">
Sollte eigentlich überflüssig sein, wenn man die action komplett weglässt wird als Standardwert nämlich auch die aktuelle URL genommen. Also einfach
müsste das selbe bewirken.<form method="post"</form> -
Hi,
klar. ein formular funktioniert auch ohne fieldset und ohne label man kann auch selfclosed-tags einfach offen lassen. Man kann auch die Tags <center> und <font> benutzen am besten alles in einem iFrame.
Aber dann kommt Semantik vs Funktion, es ist definiert das ein leeres action-attribut auf die Basic weiterleitet, d.h. in der Regel auf die aktuelle Datei.
Aber es muss sich ja net zwangsläufig jeder daran halten was irgendwo definiert wurde. In den ghängigsten Browsern gehts ja.
Allerdings könnte ein Formular ohne action="" die Daten auch ins Nirvana schießen, je nach Datensatz (passwörter etc..) kann das dumm laufen.
Ohne Action macht das formular einfach keinen Sinn in meinen Augen.
-> http://de.selfhtml.org/html/referenz/attribute.htm#form
Grüsse
Color
Beitrag zuletzt geändert: 26.3.2010 10:19:55 von color -
color schrieb:
Hi,
klar. ein formular funktioniert auch ohne fieldset und ohne label man kann auch selfclosed-tags einfach offen lassen. Man kann auch die Tags <center> und <font> benutzen am besten alles in einem iFrame.
Aber dann kommt Semantik vs Funktion, es ist definiert das ein leeres action-attribut auf die Basic weiterleitet, d.h. in der Regel auf die aktuelle Datei.
Aber es muss sich ja net zwangsläufig jeder daran halten was irgendwo definiert wurde. In den ghängigsten Browsern gehts ja.
Allerdings könnte ein Formular ohne action="" die Daten auch ins Nirvana schießen, je nach Datensatz (passwörter etc..) kann das dumm laufen.
Ohne Action macht das formular einfach keinen Sinn in meinen Augen.
-> http://de.selfhtml.org/html/referenz/attribute.htm#form
Grüsse
Color
Ohne Action ist es einfach nur namensunabhängig, was in diesem Fall passiert ist klar definiert, und es funktioniert auch in wirklich allen Browsern. Statt mühsam per PHP rauszukramen wo die Daten hinmüssen, kann man es auch einfach den Browser entscheiden lassen, weil der es eh weiß. Und zwar manchmal besser als PHP, z.B. bei manchen mod_rewrite-Geschichten oder ähnlichen Umleitungen. -
Guten Morgen,
sieht gut aus danke, blöd das ich gerade keine Verbindung zum FTP Server bekomme dann könnt ichs mal testen.
Wer es aufwändig bei der Checkbox bei den einzelnen Objekten zahlen einzufügen die dann automatisch den Endpreis angeben
EDIT:
Wiso bekomm ich keine Verbindung mehr zu meinem FTP-Server
Beitrag zuletzt geändert: 28.3.2010 14:13:19 von nano-riff -
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage
