yustie kania
6303124011
pca-12-01
Pembuatan Form Permintaan Layanan Teknologi
Informasi Berbasis PHP (Study Kasus PT. Pupuk Kujang)
Untuk pembuatan user interface pada
form permintaan layanan teknologi informasi dibuat dengan sederhana menggunakan
aplikasi adobe dreamweaver. Form ini dibuat dengan php dan css untuk pengaturan
tampilan agar dapat sesuai dengan kebutuhan. Phpmyadmin digunakan sebagai
penyimpanan database. Ini adalah
tampilan utama dalam Form Permintaan Layanan Teknologi Informasi Berbasis PHP
(Study Kasus PT. Pupuk Kujang)
Tampilan halaman utama
Tampilan pembuatan form
Berikut adalah cara pembuatan Form Permintaan Layanan Teknologi Informasi Berbasis PHP (Study
Kasus PT. Pupuk Kujang):
<html>
è pembuatan form berbasis html
<head><title>Tabel
HTML</title></head>
è pembuatan header/judul pada form
<link rel="stylesheet"
href="atur.css" type="text/css">
è <link rel="stylesheet" digunakan untuk menghubungkan
file html dan file css
è “ahref=..”digunakan untuk
menyisipkan hyperlink
è "
type="text/css"> mempunyai type input “text”,
<body bgcolor="white">
è pengaturan warna untuk background fom.
<form action="proses.php"
method="POST">
è <form action="proses.php" digunakan untuk proses
penginputan data dengan nama script “proses.php”
è method="POST"> digunakan untuk submit data yang
sedang diproses.
<table border="1"
width="790" height="100" cellspacing="0"
cellspadding="0" bgcolor="white"
bordercolor="black">
è <table border="1" digunakan untuk membuat table.
è width="790" digunakan untuk melebarkan table.
è height="100" digunakan untuk tinggi table.
è cellspacing="0" digunakan untuk memberi jarak antar
kolom.
è cellspadding="0" berguna untuk memberi jarak antar
tulisan dan kolom table.
è bgcolor="white" memberi warna background.
è bordercolor="black"> memberi warna untuk
border/garis.
<tr><th><img
src="logo.jpg">
è “<tr>” script untuk membuat garis pada table
è “<th>”script untuk table header, membuat kolom judul.
è “<tr><th>”
digunakan untuk mengatur jarak tabel logo yang digunakan untuk form.
è “<img
src="logo.jpg">” digunakan untuk mencari logo yang akan
ditampilkan pada header form.
<font
color="blue"size="6""face
arial"><b>Permintaan Layanan Teknologi
Informasi</b></font></th></tr>
è <font color="blue" digunakan untuk pemberian warna
pada font
è size="6" digunakan untuk pemberian ukuran font yang
digunakan
è face arial">
menentukan type huruf.
è “<b>” digunakan untuk bold font.
è </font> sebagai penutup type font pada table header
è </th></tr> digunakan untuk penutup mengatur jarak
tabel logo yang digunakan untuk form.
</table>
è Code yang digunakan sebagai penutup table yang paling atas atau
“kop/header form”
<table border="1"
width="790" height="100" cellspacing="0"
cellspadding="0" bgcolor="white"
bordercolor="black">
è <table border="1" digunakan untuk membuat table.
è width="790" digunakan untuk melebarkan table.
è height="100" digunakan untuk tinggi table.
è cellspacing="0" digunakan untuk memberi jarak antar
kolom.
è cellspadding="0" berguna untuk memberi jarak antar
tulisan dan kolom table.
è bgcolor="white" memberi warna background.
è bordercolor="black"> memberi warna untuk
border/garis.
<tbody bgcolor="white"
align="left"><tr><th>
è <tbody bgcolor="white" untuk pemberian warna pada isi
table/form html.
Nomor : <input
type="text" maxlength="5" size="2"name="no"/>
/PLTI/ <input type="text" maxlength="5"
size="2" name="no1" /> /
è <input type="text" untuk type data yang akan di
submit pada table.
è maxlength="5" maksimal panjang no yang akan dimasukan.
è size="2" ukuran angka yang digunakan
è name="no" input nomor pada database yang bernama “no”
è name="no1" input nomor PLTI pada database yang bernama
“no”
<select name="bulan">
<option
values="bulan">Januari
<option
values="bulan">Februari
<option
values="bulan">Maret
<option
values="bulan">April
<option values="bulan">Mei
<option
values="bulan">Juni
<option
values="bulan">Juli
<option
values="bulan">Agustus
<option
values="bulan">September
<option
values="bulan">Oktober
<option
values="bulan">November
<option
values="bulan">Desember
</select name> 20
è “<select name="bulan">” Agar dapat memudahkan
administrator maka dibuat select untuk pemilihan bulan.
è “<option values=”bulan”>Januari” berfungsi sebagai pemilihan
bulan.
<input type="text"
maxlength="3" size="1" name="tahun" />
<br>
è input type="text" untuk type data yang akan di submit
pada table.
è maxlength="3" maksimal panjang angka tahun yang akan
dimasukan.
è size="1" ukuran angka yang digunakan
è name="tahun" input tahun pada database yang dinamakan
“tahun”
è <br> script untuk pemberian line baru. Seperti enter.
Unit Kerja Peminta : Biro / Divisi
<input type="text" name="ukp" />
è input type="text" untuk type data yang akan di submit
pada table.
è name “ukp” untuk penyimpanan database Unit Kerja Peminta.
</th></tr>
è Script sebagai penutup pembuatan table.
</tbody>
è Script sebagai penutup isi html
</table>
è Script sebagai penutup pembuatan table keseluruhan.
<table border="1"
width="790" height="160" cellspacing="0"
cellspadding="0" bgcolor="white" bordercolor="black">
è <table border="1" digunakan untuk membuat table.
è width="790" digunakan untuk melebarkan table.
è height="160" digunakan untuk tinggi table.
è cellspacing="0" digunakan untuk memberi jarak antar
kolom.
è cellspadding="0" berguna untuk memberi jarak antar
tulisan dan kolom table.
è bgcolor="white" memberi warna background.
è bordercolor="black"> memberi warna untuk
border/garis.
<tbody bgcolor="white"
align="left">
è <tbody bgcolor="white" untuk pemberian warna pada isi
table/form html.
è align="left" perataan huruf pada sebelah kiri
<tr><td><b>Jenis
Peralatan/Aplikasi* </b><br> <textarea rows="7"
cols="40"
name="jpa"></textarea></td><td><b>Jenis
Kerusakan/Gangguan </b><br> <textarea rows="7"
cols="40" name="jkg" /></textarea></td></tr>
è “<tr>” script untuk membuat garis pada table .
è “<td>” membuat kolom pada table.
è “<b>” bold
è <br> script untuk pemberian line baru. Seperti enter.
</tbody>
è Script sebagai penutup isi html
</table>
è Script sebagai penutup seluruh tabel
<table border="1"
width="790" height="100" cellspacing="0"
cellspadding="0" bgcolor="white"
bordercolor="black">
è <table border="1" digunakan untuk membuat table.
è width="790" digunakan untuk melebarkan table.
è height="100" digunakan untuk tinggi table.
è cellspacing="0" digunakan untuk memberi jarak antar
kolom.
è cellspadding="0" berguna untuk memberi jarak antar
tulisan dan kolom table.
è bgcolor="white" memberi warna background.
è bordercolor="black"> memberi warna untuk
border/garis.
<tbody bgcolor="white"
>
è tbody bgcolor="white" untuk pemberian warna pada isi
table/form html.
<tr><td>
è “<tr>” script untuk membuat garis pada table .
è “<td>” membuat kolom pada table.
<div id="a"
style="background-color:white;height:200px;width:385px;float:left;">
è <div id="a" untuk mengelompokan suatu element menjadi
sebuah group.
è “style="background-color:white;” pemberian warna background
è “float:left;">” untuk membuat layout.
Diterima pada <input
type="date" name="diterima"/>
<br><br><br><br><br> <pre>( )</pre><br>
è <br> script untuk pemberian line baru. Seperti enter.
è <pre> Preformated text. Semua spasi yang bukan script akan
sama letaknya dengan yang ditulis.
Help desk </div>
è Sebagai penutup untuk mengelompokan suatu element menjadi sebuah
group.
<div id="b" style="background-color:white;height:200px;width:395px;float:left;">
è <div id="a" untuk mengelompokan suatu element menjadi
sebuah group.
è “style="background-color:white;” pemberian warna background
è “float:left;">” untuk membuat layout.
Dilaporkan pada <input
type="date" name="dilaporkan"/>
<br><br><br><br><br> <pre> ( )</pre><br>
è <br> script untuk pemberian line baru. Seperti enter.
è <pre> Preformated text. Semua spasi yang bukan script akan
sama letaknya dengan yang ditulis.
Supervisor / Superintendent
</div>
è Sebagai penutup untuk mengelompokan suatu element menjadi sebuah
group.
</td></tr>
è Sebagai penutup pembuatan garis dan kolom
</tbody>
</table>
è Penutup keseluruhan pembuatan tabel
<tr><td>------------------------------------------------------------------------------------------------------------------------------------</td></tr><br>
è “<tr>” script untuk membuat garis pada table .
è “<td>” membuat kolom pada table.
<table border="1"
width="790" height="60" cellspacing="0" cellspadding="0"
bgcolor="white" bordercolor="black">
è <table border="1" digunakan untuk membuat table.
è width="790" digunakan untuk melebarkan table.
è height="60" digunakan untuk tinggi table.
è cellspacing="0" digunakan untuk memberi jarak antar
kolom.
è cellspadding="0" berguna untuk memberi jarak antar
tulisan dan kolom table.
è bgcolor="white" memberi warna background.
è bordercolor="black"> memberi warna untuk
border/garis.
<tr><th>
è “<tr>” script untuk membuat garis pada table
è “<th>”script untuk table header, membuat kolom judul.
<font
color="black"size="4""face
arial"><b>Pelaksanaan Layanan Teknologi
Informasi</b></font></th></tr>
</table>
è “<font color="black"” untuk pemberian warna pada font
è "size="4"
<table border="1"
width="790" height="100" cellspacing="0"
cellspadding="0" bgcolor="white"
bordercolor="black">
è <table border="1" digunakan untuk membuat table.
è width="790" digunakan untuk melebarkan table.
è height="100" digunakan untuk tinggi table.
è cellspacing="0" digunakan untuk memberi jarak antar
kolom.
è cellspadding="0" berguna untuk memberi jarak antar
tulisan dan kolom table.
è bgcolor="white" memberi warna background.
è bordercolor="black"> memberi warna untuk
border/garis.
è “<b>” digunakan untuk bold font.
<tbody bgcolor="white"
align="left"><tr><th><b>
è tbody bgcolor="white" untuk pemberian warna pada isi
table/form html.
è “<tr>” script untuk membuat garis pada table
è “<th>”script untuk table header, membuat kolom judul.
è “<b>” digunakan untuk bold font.
Analisa Permasalahan
</b><br> <textarea rows="7" cols="60"
name="ap" /></textarea>
è “</b>” digunakan untuk penutup bold font.
è <br> script untuk pemberian line baru. Seperti enter.
è <textarea rows="7" cols="60" membuat text
area pada kolom analisa permasalahan.
è name="ap" nama database untuk inputan analisa
permasalahan
</th></tr>
è script penutup garis table dan header
</tbody>
è penutup isi form html
</table>
è penutup untuk pembuatan table
<table border="1"
width="790" height="200" cellspacing="0"
cellspadding="0" bgcolor="white"
bordercolor="black">
è <table border="1" digunakan untuk membuat table.
è width="790" digunakan untuk melebarkan table.
è height="200" digunakan untuk tinggi table.
è cellspacing="0" digunakan untuk memberi jarak antar
kolom.
è cellspadding="0" berguna untuk memberi jarak antar
tulisan dan kolom table.
è bgcolor="white" memberi warna background.
è bordercolor="black"> memberi warna untuk
border/garis.
<tbody bgcolor="white"
align="left">
è tbody bgcolor="white" untuk pemberian warna pada isi
table/form html.
è align="left" perataan huruf pada sebelah kiri
<tr><td><b>Solusi
oleh Help-Desk </b><br> <textarea rows="7"
cols="40"
name="sol"></textarea></td><td><b>Hasil /
Rekomendasi </b><br> <textarea rows="7"
cols="40" name="hrsol" /></textarea>
<br><br> Eskalasi Permasalahan : <input type="radio"
name="ep" value="YA"> YA <input
type="radio" name="ep" value="TIDAK"> TIDAK
<br></td></tr>
</tbody>
</table>
è “<tr>” script untuk membuat garis pada table
è “<th>”script untuk table header, membuat kolom judul.
è “<b>” digunakan untuk bold font.
è <br> script untuk pemberian line baru. Seperti enter.
è <textarea rows="7" cols="40"
name="sol"></textarea> script untuk membuat text area pada
kolom solusi oleh Help-desk dan mempunyai database yang bernama “sol”
è <textarea rows="7" cols="40"
name="hrsol" /></textarea> script untuk membuat text area
pada kolom hasil/ rekomendasi dan mempunyai database yang bernama “hrsol”
è Eskalasi Permasalahan : <input type="radio"
name="ep" script pembuatan pemilihan berupa radio dan database bernama
“ep”.
è “value="YA"> YA <input type="radio"
name="ep" value="TIDAK"> TIDAK” pembuatan radio dan
mempunyai value “YA” dan “TIDAK”.
è </table> penutup untuk pembuatan table
<table border="1"
width="790" height="160" cellspacing="0"
cellspadding="0" bgcolor="white"
bordercolor="black">
è <table border="1" digunakan untuk membuat table.
è width="790" digunakan untuk melebarkan table.
è height="160" digunakan untuk tinggi table.
è cellspacing="0" digunakan untuk memberi jarak antar
kolom.
è cellspadding="0" berguna untuk memberi jarak antar
tulisan dan kolom table.
è bgcolor="white" memberi warna background.
è bordercolor="black"> memberi warna untuk border/garis
<tbody bgcolor="white"
align="left">
è tbody bgcolor="white" untuk pemberian warna pada isi
table/form html.
è align="left" perataan huruf pada sebelah kiri
<tr><td
width="388"><b>Penanganan oleh User-Support
</b><br> <textarea rows="7" cols="40"
name="pos"></textarea></td><td
width="392"><b>Hasil / Rekomendasi </b><br>
<textarea rows="7" cols="40" name="hrpos" /></textarea></td></tr>
</tbody>
</table>
è “<tr>” script untuk membuat garis pada table
è “<td>” membuat kolom pada table.
è width="388" digunakan untuk melebarkan table.
è “<b>” digunakan untuk
bold font.
è <br> script untuk pemberian line baru. Seperti enter.
è <textarea rows="7" cols="40" name="pos"></textarea>
script untuk membuat text area pada kolom Penanganan oleh User-Support dan
mempunyai database yang bernama “hrpos”
è <textarea rows="7" cols="40"
name="hrpos" /></textarea> script untuk membuat text area pada
kolom hasil/ rekomendasi dan mempunyai database yang bernama “hrsol”
è </table> penutup untuk pembuatan table
<table border="1"
width="790" height="286" cellspacing="0"
cellspadding="0" bgcolor="white"
bordercolor="black">
è <table border="1" digunakan untuk membuat table.
è width="790" digunakan untuk melebarkan table.
è height="286" digunakan untuk tinggi table.
è cellspacing="0" digunakan untuk memberi jarak antar
kolom.
è cellspadding="0" berguna untuk memberi jarak antar
tulisan dan kolom table.
è bgcolor="white" memberi warna background.
è Bordercolor=”black” memberi warna untuk border/garis.
<tbody bgcolor="white"
>
è tbody bgcolor="white" untuk pemberian warna pada isi
table/form html.
<tr><td width="260"
height="284">
è “<tr>” script untuk membuat garis pada table
è width="260" digunakan untuk melebarkan table.
è height="284" digunakan untuk tinggi table.
<div
id="c" style="background-color:white;">
è <div id="c" untuk mengelompokan suatu element menjadi
sebuah group.
è style="background-color:white;"> pemberian wana pada
background css.
Mengetahui,
<br><br><br><br><br> <pre> ( )</pre><br>
Manajer Teknologi Informasi </div>
</td><td
width="260">
<div id="d" style="background-color:white;">
Menyetujui, <br><br><br><br><br>
<pre> ( )</pre><br>
User
</div>
</td>
è <br> script untuk pemberian line baru. Seperti enter.
è <pre> Preformated text. Semua spasi yang bukan script akan
sama letaknya dengan yang ditulis.
è width="260" digunakan untuk melebarkan table.
è <div id="d" untuk mengelompokan suatu element menjadi
sebuah group.
<th width="252">
<div id="e"
style="background-color:white;">
Help desk,
<br><br><br><br><br><pre> ( )</pre><br>
</div>
SEMOGA BERMANFAAT !!! :)
reference :
www.taufiknuradi.com
