ιαχείριση Πληροφοριών στο ιαδίκτυο

Μέγεθος: px

Εμφάνιση ξεκινά από τη σελίδα:

Download "ιαχείριση Πληροφοριών στο ιαδίκτυο"

Φερενίκη Δημητρίου
8 χρόνια πριν
Προβολές:

1 ιαχείριση Πληροφοριών στο ιαδίκτυο Εργαστήριο (Φυλλάδιο 7) ΤΕΙ Καβάλας - Σχολή ιοίκησης & Οικονοµίας Τµήµα ιαχείρισης Πληροφοριών ιδάσκων: Μαρδύρης Βασίλειος, ιπλ. Ηλ. Μηχανικός & Μηχ. Υπολογιστών, MSc (El. & Comp. Eng) 1. Στόχοι Στόχος του εργαστηρίου είναι η δηµιουργία ιστοσελίδων µε δυνατότητα λήψης δεδοµένων από το χρήστη. Στο εργαστήριο θα παρουσιαστεί η έννοια της φόρµας στον κώδικα HTML και θα περιγραφεί η λειτουργία της και η αλληλεπίδρασή της µε εκτελέσιµα προγράµµατα που βρίσκονται στον webserver. Προκειµένου να επιτευχθούν οι στόχοι του εργαστηρίου, αρχικά θα πληκτρολογηθούν και θα παρουσιαστούν παραδείγµατα σελίδων και στη συνέχεια θα ζητηθεί η κατασκευή απλών σελίδων από τους φοιτητές. 2. ηµιουργία πλαισίων εισαγωγής κειµένου (input fields) Όνοµα: <INPUT type="text" name="firstname"><br> Επώνυµο: <INPUT type="text" name="lastname"> Να αποθηκέψετε τον παραπάνω κώδικα HTML σε αρχείο µε όνοµα page7a.html µέσα στο (όπου username είναι το προσωπικό 1

Στο εργαστήριο θα παρουσιαστεί η έννοια της φόρµας στον κώδικα HTML και θα περιγραφεί η λειτουργία της και η αλληλεπίδρασή της µε εκτελέσιµα προγράµµατα που βρίσκονται στον webserver.

2 3. ηµιουργία πλαισίων εισαγωγής κρυφών κωδικών (password fields) Όνοµα χρήστη: <INPUT type="text" name="user"><br> Κωδικός: <INPUT type="password" name="password"> Όταν πληκτρολογούµε σε πλαίσιο εισαγωγής κρυφών κωδικών, ο browser εµφανίζει αστεράκια ή τελείες αντί για τους χαρακτήρες. Να αποθηκέψετε τον παραπάνω κώδικα HTML σε αρχείο µε όνοµα page7b.html µέσα στο (όπου username είναι το προσωπικό 4. ηµιουργία πλαισίων επιλογής (check boxes) Με αυτόµατο κιβώτιο ταχυτήτων: <INPUT type="checkbox" name="auto"><br> Με δερµάτινα καθίσµατα: <INPUT type="checkbox" name="leather"> 2

Να αποθηκέψετε τον παραπάνω κώδικα HTML σε αρχείο µε όνοµα page7b.html µέσα στο http://infoman.teikav.edu.gr/~username/page7b.

3 Να αποθηκέψετε τον παραπάνω κώδικα HTML σε αρχείο µε όνοµα page7c.html µέσα στο (όπου username είναι το προσωπικό 5. ηµιουργία πλήκτρων επιλογής (radio buttons) Άνδρας: <INPUT type="radio" checked name="sex" value="male"><br> Γυναίκα: <INPUT type="radio" name="sex" value="female"> Όταν κάνουµε κλικ σε κάποιο από τα radio-buttons ενεργοποιείται και τα υπόλοιπα απενεργοποιούνται. Να αποθηκέψετε τον παραπάνω κώδικα HTML σε αρχείο µε όνοµα page7d.html µέσα στο (όπου username είναι το προσωπικό 3

ηµιουργία πλήκτρων επιλογής (radio buttons) Άνδρας: <INPUT type="radio" checked name="sex" value="male"><br> Γυναίκα: <INPUT type="radio" name="sex"

4 6. ηµιουργία πλαισίου επιλογής µε λίστα (I) <SELECT name="f1cars"> <OPTION value="ferrari"> Ferrari <OPTION value="mclaren"> Mclaren <OPTION value="williams"> Williams <OPTION value="minardi"> Minardi </SELECT> Να αποθηκέψετε τον παραπάνω κώδικα HTML σε αρχείο µε όνοµα page7e.html µέσα στο (όπου username είναι το προσωπικό 4

value="minardi"> Minardi </SELECT> Να αποθηκέψετε τον παραπάνω κώδικα HTML σε αρχείο µε όνοµα

5 7. ηµιουργία πλαισίου επιλογής µε λίστα (II) <SELECT name="f1cars"> <OPTION value="ferrari"> Ferrari <OPTION value="mclaren"> Mclaren <OPTION value="williams"> Williams <OPTION value="minardi" selected> Minardi </SELECT> Να αποθηκέψετε τον παραπάνω κώδικα HTML σε αρχείο µε όνοµα page7f.html µέσα στο (όπου username είναι το προσωπικό 8. ηµιουργία πλαισίου κειµένου πολλών γραµµών <TEXTAREA rows="10" cols="30"> Μέσα στο πλαίσιο κειµένου πολλών γραµµών µπορείτε να εισάγετε µεγάλο κείµενο. </TEXTAREA> 5

µε όνοµα page7f.html µέσα στο http://infoman.teikav.edu.gr/~username/page7f.html (όπου username είναι το προσωπικό 8.

6 Να αποθηκέψετε τον παραπάνω κώδικα HTML σε αρχείο µε όνοµα page7g.html µέσα στο (όπου username είναι το προσωπικό 9. Σελίδα µε πλαίσια εισαγωγής κειµένου και πλήκτρο αποστολής Όνοµα: <INPUT type="text" name="firstname" value="mickey"><br> Επώνυµο: <INPUT type="text" name="lastname" value="mouse"><br> <INPUT type="submit" value="αποστολή"> Με κλίκ στο πλήκτρο Αποστολή στέλνουµε τα στοιχεία στο script program.tcl Να αποθηκέψετε τον παραπάνω κώδικα HTML σε αρχείο µε όνοµα page7h.html µέσα στο (όπου username είναι το προσωπικό 6

Σελίδα µε πλαίσια εισαγωγής κειµένου και πλήκτρο αποστολής Όνοµα: <INPUT type="text" name="firstname" value="mickey"><br> Επώνυµο: <INPUT type="text"

7 10. Σελίδα µε πλαίσια επιλογής (check boxes) και πλήκτρο αποστολής Με αυτόµατο κιβώτιο ταχυτήτων: <INPUT type="checkbox" name="auto"><br> Με δερµάτινα καθίσµατα: <INPUT type="checkbox" name="leather"><br> <INPUT type="submit" value="αποστολή"> Με κλικ στο πλήκτρο Αποστολή στέλνουµε τα στοιχεία στο script program.tcl Να αποθηκέψετε τον παραπάνω κώδικα HTML σε αρχείο µε όνοµα page7i.html µέσα στο (όπου username είναι το προσωπικό 7

value="αποστολή"> Με κλικ στο πλήκτρο Αποστολή στέλνουµε τα στοιχεία στο script program.

8 11. Σελίδα µε πλήκτρα επιλογής (radio buttons) και πλήκτρο αποστολής Άνδρας: <INPUT type="radio" name="sex" value="male" checked><br> Γυναίκα: <INPUT type="radio" name="sex" value="female"><br> <INPUT type ="submit" value ="Αποστολή"> Με κλικ στο πλήκτρο Αποστολή στέλνουµε τα στοιχεία στο script program.tcl Να αποθηκέψετε τον παραπάνω κώδικα HTML σε αρχείο µε όνοµα page7j.html µέσα στο (όπου username είναι το προσωπικό 12. Αποστολή µε τη χρήση φόρµας εισαγωγής κειµένου <FORM method="post" enctype="text/plain"> 8

program.tcl Να αποθηκέψετε τον παραπάνω κώδικα HTML σε αρχείο µε όνοµα page7j.html µέσα στο http://infoman.teikav.edu.gr/~username/page7j.

9 <H3>Αυτή η φόρµα στέλνει ένα .</η3> Όνοµα:<BR> <INPUT type="text" name="name" value="******" size="20"><br> Mail:<BR> <INPUT type="text" name="mail" size="20"><br> Σχόλιο:<BR> <INPUT type="text" name="comment" value="yourcomment" size="40"><br><br> <INPUT type="submit" value="αποστολή"> <INPUT type="reset" value=" ιαγραφή Όλων"> Να αποθηκέψετε τον παραπάνω κώδικα HTML σε αρχείο µε όνοµα page7k.html µέσα στο (όπου username είναι το προσωπικό 9

value="*****@******" size="20"><br> Σχόλιο:<BR> <INPUT type="text" name="comment" value="yourcomment" size="40"><br><br> <INPUT

Σχετικά έγγραφα

Προγραμματιστικές Εφαρμογές στο Διαδίκτυο Εργαστήριο 5

Προγραμματιστικές Εφαρμογές στο Διαδίκτυο Εργαστήριο 5 Τεχνολογικό Εκπαιδευτικό Ίδρυμα Κεντρικής Μακεδονίας Σχολή Τεχνολογικών Εφαρμογών Τμήμα Μηχανικών Πληροφορικής 1. Στόχος Στόχος του εργαστηρίου είναι