HTML Formulare Benutzerschnittstelle für interaktive

Transcrição

1
HTML Formulare
Benutzerschnittstelle für interaktive Webseiten
2
Literatur und Links
Literatur:
Coar, Ken; Bowen, Rich: Apache-Kochbuch. 2004
HTML: kein Buch oder irgend eins für Einsteiger, z. B.
Münz, Stefan; Nefzger, Wolfgang: HTML 4.0 Handbuch.
HTML, JavaScript, DHTML, Perl. 1999
Links:
Apache:
http://httpd.apache.org/docs/2.2/de/
XAMP:
http://www.apachefriends.org/de/xampp.html
HTML:
http://de.selfhtml.org/
Notepad++:
http://notepad-plus-plus.org/download/v6.1.8.html
PHP:
http://www.selfphp.de/
Python:
http://www.python.org/
BSCW:
http://www.bscw.de/unternehmen.html
Eclipse:
http://www.eclipse.org/downloads/
CSS
http://www.css4you.de/
PHP
http://www.selfphp.de/
CSS Smartphone http://aktuell.de.selfhtml.org/artikel/css/mobile-endgeraete/
http://www.zuellich.de/tutorials/css-fuer-smartphones
Notepad++:
http://notepad-plus-plus.org/download/v6.1.8.html
Prof. Dr. rer. nat. Claus Brell, http://claus-brell.de, [email protected], Wirtschaftsinformatik, Statistik
Wie gestalte ich Interaktive Webseiten?
3
Grundsätzliches Vorgehen
Erstellung einer Interaktiven Webanwendung mit PHP:
1.) Erzeugen einer HTML-Seite (z.B. formular.html) mit einem
Formular und einem Aufruf eines Antwortscriptes (z.B.
antwort.php).
2.) Erzeugen eines Antwortscriptes (z.B. mit PHP wie antwort.php)
3.) Testen.
Wie funktioniert eine interaktive Internetseite grundsätzlich
1. Aufruf eines HTML-Formulars(*)
2. Ausfüllen HTML-Formulars(*)
4
Ihre Eingabe:
huba buba
Browser
Absenden
3. Abschicken des HTML-Formulars:
mit HTTP POST oder HTTP GET werden
Daten an Webserver übertragen.(*)
4. Programm / Script bearbeitet Daten
und erzeugt als Ausgabe HTML-Code
5. Ausgabe wird an Browser zurück
übertragen und angezeigt.
antwort.php
Server
Ihre Eingabe:
huba buba
Ergebnis:
schubi dubi
Browser
(*) Alternativ kann ein Programm / Script mit HTTP GET auch
ohne Formular in der Browsereingabezeile aufgerufen werden.
Wie sieht ein einfaches Formular in HTML aus?
5
Ein einfaches HTML-Formular (ohne HTML-Rahmen <html><head>…..)
<form method="get"
action="antwort.php"
enctype="multipart/form-data">
Text in Zeile eingeben:
<br>
<input type="text" name="TEXT"
size="30">
<br>
<input type="submit" name="L"
value="Absenden">
</form>
Wie sieht ein einfaches PHP-Script aus?
6
Ein einfaches Script zur
Illustration.
Zur PHP-Programierung
gibt es einen eigenen
Foliensatz.
7
Wie ist eine „form“ aufgebaut?
Formulare
allgemein
Hier: Methode GET, es gibt auch
noch POST, HEAD….
<form method="get" action="antwort.php" >
…..
Verschiedene Eingabefelder, Führungstexte etc
……
</form>
Auswertungsscript,
Heißt so, wie Sie es
genannt haben
Wie werden in HTML Texteingabefelder dargestellt?
8
Formulare
Textfelder

<form method="get" action="antwort2.php">
Text in Textbereich eingeben:
<br>
<textarea name="TEXT" cols=45 rows=5/></textarea>
<br>
<input type="submit" name="L" value="Absenden">
</form>

<form method="get" action="antwort2.php">
<br>
<input type="text" name="TEXT" size="30">
<br>
</form>
9
Wie wird ein einzeiliges Textfeld codiert?
<form method="get"
action="antwort.php"
enctype="multipart/form-data">
<br>
<input type="text" name="TEXT"
size="30">
<br>
value="Absenden">
</form>
Das Script antwort.php muss sich im gleichen Verzeichnis auf dem Webserver
befinden wie das Formular. Sonst voll qualifizieren.
http://de.selfhtml.org/navigation/suche/index.htm?Suchanfrage=referenzen
Wie sieht die Ausgabe von antwort.php aus?
10
Aufruf mit einzeiligem Textfeld im Formular oder direkt in der
Browserzeile, z.B.
http://claus-brell.de/.../.../.../antwort.php?TEXT=bla+bla+bla
Wie wird ein mehrzeiliges Textfeld codiert?
11
<textarea name="TEXT" cols=45
rows=5/></textarea>
value="Absenden">
Wie können „Anhakkästchen“ dargestellt werden?
12
Formulare
Checkboxen
(„multiple choice Mehrfachauswahl“)
<form method="get" action="antwort2.php" >
Eine oder mehrere Möglichkeiten in den Checkboxen auswählen:
<br>
<input type="checkbox" name="AUSWAHL1" value="1">
erste Auswahlmöglichkeit<br>
<input type="checkbox" name="AUSWAHL2" value="2">
zweite Auswahlmöglichkeit<br>
<br>
</form>
Vorbelegung einer Checkbox mit: checked=„checked“.
„AUSWAHL1“ wird als Variablenname übertragen.
Variablennamen müssen unterschiedlich sein.
http://wiki.selfhtml.org/wiki/HTML/Formulare/Checkboxen
Wie können Auswahlknöpfe (Einfachauswahl) dargestellt werden?
13
Formulare Radiobutons
(„multiple choice Einfachfachauswahl“)
<form method="get" action="antwort2.php" >
Genau eine Möglichkeit in den Radiobuttons auswählen:
<br>
<input type="radio" name="AUSWAHL" value="a">
erste Auswahlmöglichkeit<br>
<input type="radio" name="AUSWAHL" value="b"
checked="checked">
zweite Auswahlmöglichkeit<br>
<br>
</form>
Variablenname muss gleich sein.
Beispiele unter http://claus-brell.de/................../..../formulartest2.htm
http://wiki.selfhtml.org/wiki/HTML/Formulare/Radio-Buttons

HTML Formulare Benutzerschnittstelle für interaktive

Transcrição

Documentos relacionados

kein Wind

Sabrina Staubitz - Studio D Entertainment

Nähere Informationen: www.fgeo.rwth

Bassmonsters begeistern

Grundlagen PHP - Programmierung Teil C

Das ratiopharm Zwillings-Spiel

Sicherung und Ausbau von Deutsch als unsere nationale

Teilnehmer der Jugendturniere TuS Harpen 2013

Asset Based Lending – Ein innovatives Instrument der

Interessante Internet Adressen