The frist write script below on your text editor and save with name form_biodata.php.
<html>
<head> <title>Formulir Biodata</title>
</head>
<link rel="stylesheet" type="text/css" href="cssbiodata.css"/>
<body>
<b><h2>Biodata</h2></b>
<form action="process_form.php" method="post">
<table class="table" >
<tr>
<td>Name</td>
<td align="right">:</td>
<td><input type="text" name="name" size="60"/></td>
</tr>
<tr>
<td>Birthday</td>
<td align="right">:</td>
<td> <select name="day">
<option selected="selected">Day</option>
<?php
for($day=1; $day<=31; $day+=1){
echo"<option value=$day> $day </option>";}
?>
</select>
-
<select name="month">
<option selected="selected">Month</option>
<?php
$month=array("January", "February", "March", "April", "May", "June",
"July", "August", "September", "October", "November", "December");
$total_month=count($month);
for($mon=0; $mon<$total_month; $mon+=1){
echo"<option value=$month[$mon]> $month[$mon] </option>";}
?>
</select>
-
<select name="year">
<option selected="selected">Year</option>
<?php
for($year=2012; $year>=1905; $year-=1){
echo"<option value=$year> $year </option>";}
?>
</select>
</td>
</tr>
<tr>
<td>Gender</td>
<td align="right">:</td>
<td><input type="radio" name="gender" value="male" /> Male
<input type="radio" name="gender"value="female" />Female</td>
</tr>
<tr>
<td>Married ?</td>
<td align="right">:</td>
<td><input type="checkbox" name="check_married"> Yes</td>
</tr>
<tr>
<td>Address</td>
<td align="right">:</td>
<td><textarea name="address" rows="3" cols="47" /></textarea> </td>
</tr>
<tr>
<td></td>
<td></td>
<td><input type="submit" value="Submit" class="button"/></td>
</tr>
</table>
</form>
</body>
</html>
Description of script above
Script below is use to call file css for style in form_biodata.php. file css which is we will create later.
<link rel="stylesheet" type="text/css" href="cssbiodata.css"/>
Script below is use to make a form. Action at this form is file process_form.php, Which is we will create later. And method at this form is POST.
<form action="process_form.php" method="post">
Script below is use to make a table. Table usually followed by a tag
for make a table. Read my article about Tags HTML here.
<table class="table" >
Script below is use to make text field for input data. name of text field below is name, size is length of text field.
<input type="text" name="name" size="60"/>
Script below is use to make input data is already available in select element. There is looping in this srcipt, is use to show number from 1 to 31 as days in 1 month.
<select name="day">
<option selected="selected">Day</option>
<?php for($day=1; $day<=31; $day+=1){
echo"<option value=$day> $day </option>";}?>
</select>
Script below is not different with script above. There is looping in this srcipt, is use to show all of data array in variable $month thet is name of month.
<select name="month">
<option selected="selected">Month</option>
<?php
$month=array("January", "February", "March", "April", "May", "June",
"July", "August", "September", "October", "November", "December");
$total_month=count($month);
for($mon=0; $mon<$total_month; $mon+=1){
echo"<option value=$month[$mon]> $month[$mon] </option>";}
?>
</select>
Script below is not different with script above whic is show of days. Script below will show years from 1905 to 2012. Let's see below.
<select name="year">
<option selected="selected">Year</option>
<?php
for($year=2012; $year>=1905; $year-=1){
echo"<option value=$year> $year </option>";}
?>
</select>
Below is script use to make radio button to select gender male or female. Let's see script.
<input type="radio" name="gender" value="male" /> Male
<input type="radio" name="gender"value="female" />Female
Below is script use to make checkbox.
<input type="checkbox" name="check_married"> Yes
Below is script use to make textarea.
<textarea name="address" rows="3" cols="47" /></textarea>
Below is script use to make submit button.
<input type="submit" value="Submit" class="button"/>
Below is script css for style of form. Save Script below with name cssbiodata.css . Let's see below.
body{font-family: arial, sans-serif;}
#belang{color: #000;
border-spacing: 0;
width:60%;
}
#belang td {background-color: #ffffff;}
#belang tr:nth-child(odd) td {
background-color: #e0e0e0;}
.table{
background-color: #e0e0e0;
}
.button {
border: 0px solid #006;
background: #6b952c;
color:#ffffff;
font-weight: bold;
font-size: 12pt;}
Below is output of form_biodata.php
To make file to show data which is inputted, let's see my next article here thet is Make Form part 2.
No comments:
Post a Comment