Lab 02 HTML (Part 2)

Lab 02 - Online ticketing system 
For this lab , there are four element included which is text box, password box, radio buttons and check boxes.

Text box - A box in which anything can be typed (e.g: letters, numbers) via the keyboard. Default size is 20 characters. 

Password box - password box is password field. The computer will displays bullet or asterisks.

Radio buttons - Best used when you want the user to select one of a limited number of choices.

Check boxes -  Allows user to select more than one option. 



<html>
<head>
<title> LAB02s238809 </title>

<link rel="stylesheet" href="s238809shahira.css">

</head>
<html>
<body style="background-color:darksalmon;">

<p align="center">
<img src="AirAsia.jpg"width="300"height="300">

<table border="1"align="center"width="40%"
<tr>
<td><b><h3><center>Now everyone can fly. Come and book your ticket now!</h3>

</tr>
</td>
</b>
</center>
</table>


<h3>-MEMBER LOGIN-</h3>
<form action="insert.asp"method="post">

My Name: <INPUT type="text"name="myname" size=30 maxlength=20>
</form>


Password: <INPUT type="password"name="pwd" size=15 maxlength=15>
</form>
<hr>

<head>
<title>Radio Button</title>
</head>

<h2>Search Flight</h2>

<form action="insert.asp"method="post">
<P>
<INPUT type="radio"name="os"value="One Way">One Way<BR>
<INPUT type="radio"name="os"value="Return">Return<BR>
</P>
</form>

<head>
<title>Select</title>
</head>

<h2>Select your destination</h2>

<form action="insert.asp"method="post">
<P>Departure
<SELECT name="destination">
<OPTION>Please select your destination
<OPTION>Alor Setar (AOR)
<OPTION>Bintulu (BTU)
<OPTION>Johor Bharu (JHB)
<OPTION>Kota Bharu (KBR)
<OPTION>Kota Kinabalu (KBI)
<OPTION>Kuala Lumpur (KUL)
<OPTION>Kuala Terengganu (TGG)
<OPTION>Kuching (KCH)
<OPTION>Labuan (LBU)
<OPTION>Langkawi (LGK)
<OPTION>Miri (MYY)
<OPTION>Penang (PEN)
<OPTION>Sandakan (SDK)
<OPTION>Sibu (SBW)
<OPTION>Tawau (TWU)
</SELECT>
</P>
</form>

<head>
<title>Select</title>
</head>

<form action="insert.asp"method="post">
<P>Ariving
<SELECT name="destination">
<OPTION>Please select your destination
<OPTION>Alor Setar (AOR)
<OPTION>Bintulu (BTU)
<OPTION>Johor Bharu (JHB)
<OPTION>Kota Bharu (KBR)
<OPTION>Kota KInabalu (KBI)
<OPTION>Kuala Lumpur (KUL)
<OPTION>Kuala Terengganu (TGG)
<OPTION>Kuching (KCH)
<OPTION>Labuan (LBU)
<OPTION>Langkawi (LGK)
<OPTION>Miri (MYY)
<OPTION>Penang (PEN)
<OPTION>Sandakan (SDK)
<OPTION>Sibu (SBW)
<OPTION>Tawau (TWU)

</SELECT>
</P>
</form>

<head>
<title>Select</title>
</head>

<h2>Select your date</h2>

<form action="insert.asp"method="post">
<P>Day
<SELECT name="Day">
<OPTION>Please select your day
<OPTION>1
<OPTION>2
<OPTION>3
<OPTION>4
<OPTION>5
<OPTION>6
<OPTION>7
<OPTION>8
<OPTION>9
<OPTION>10
<OPTION>11
<OPTION>12
<OPTION>13
<OPTION>14
<OPTION>15
<OPTION>16
<OPTION>17
<OPTION>18
<OPTION>19
<OPTION>20
<OPTION>21
<OPTION>22
<OPTION>23
<OPTION>24
<OPTION>25
<OPTION>26
<OPTION>27
<OPTION>28
<OPTION>29
<OPTION>30
<OPTION>31
</SELECT>
</P>
</form>

<head>
<title>Select</title>
</head>

<form action="insert.asp"method="post">
<P>Month
<SELECT name="Month">
<OPTION>Please select your month
<OPTION>Januari (JAN)
<OPTION>Februari (FEB)
<OPTION>March (MAR)
<OPTION>April (APR)
<OPTION>May (MAY)
<OPTION>June (JUN)
<OPTION>July (JUL)
<OPTION>August (AUG)
<OPTION>September (SEPT)
<OPTION>October (OCT)
<OPTION>November (NOV)
<OPTION>December (DIS)
</SELECT>
</P>
</form>

<head>
<title>Select</title>
</head>

<form action="insert.asp"method="post">
<P>Year
<SELECT name="Year">
<OPTION>Please select your year
<OPTION>2017
<OPTION>2018
<OPTION>2019
<OPTION>2020
<OPTION>2021
<OPTION>2022
<OPTION>2023
<OPTION>2024
<OPTION>2025
<OPTION>2026
<OPTION>2027
<OPTION>2028
</SELECT>
</P>
</form>

<h2>Passenger</h2>
<style>
table, th, td {
    border: 2px solid red;
}
</style>
<table style="width:100%">

  <tr>
    <th>Children</th>
    <th>Adult</th>
    <th>Senior Citizen</th>
  </tr>
<td>
<head>
<title>Select</title>
</head>

<form action="insert.asp"method="post">
<P>Children
<SELECT name="children">
<OPTION>Please select number
<OPTION>0
<OPTION>1
<OPTION>2
<OPTION>3
<OPTION>4
<OPTION>5
<OPTION>6
<OPTION>7
<OPTION>8
<OPTION>9
<OPTION>10
</SELECT>
</P>
</form>

<td>
<head>
<title>Select</title>
</head>

<form action="insert.asp"method="post">
<P>Adult
<SELECT name="adult">
<OPTION>Please select number
<OPTION>0
<OPTION>1
<OPTION>2
<OPTION>3
<OPTION>4
<OPTION>5
<OPTION>6
<OPTION>7
<OPTION>8
<OPTION>9
<OPTION>10
</SELECT>
</P>
</form>

<td>
<head>
<title>Select</title>
</head>

<form action="insert.asp"method="post">
<P>Senior Citizen
<SELECT name="senior citizen">
<OPTION>Please select number
<OPTION>0
<OPTION>1
<OPTION>2
<OPTION>3
<OPTION>4
<OPTION>5
<OPTION>6
<OPTION>7
<OPTION>8
<OPTION>9
<OPTION>10
</SELECT>
</P>
</form>

</td></tr></table>
<br>
<form action="insert.asp"method="post">
<INPUT type="submit"value="Check Out">
<hr>

<h2>Need help? Email us</h2>

<form action="insert.asp"method="post">
Your Comment:<BR>
<TEXTAREA name="write your comments" rows=4 cols=65>
</TEXTAREA>

<form action="insert.asp"method="post">
<INPUT type="submit"value="Send">

</form></html></body>




Comments