>>
Dasar Pemrograman Web 1
:: Pendahuluan
Pastilah kita
pernah mengunjungi suatu situs yang sangat berkesan, misalnya dari sisi layout
dan desainnya atau dari sisi interaktifnya, seperti bhinneka.com, amazon.com,
ebay.com, dan lain-lain. Pastilah kita pernah mengisikan sesuatu pada sebuah
situs baik itu sebuah buku tamu, polling, email dan lain-lain. Lalu kita juga
dapat melihat pada halaman tersebut seperti tanggal saat ini, jam, dan jumlah
pengunjung yang telah melihat situs tersebut.
Sebelum kita
meranjak ke materi lainnya, ada baiknya kita mengeri dahulu cara kerja Internet
dalam hal ini konsep client server dan peer to peer. Kita tidak usah
membicarakan bagaimana data berjalan dan sampai ketujuan dengan melewati
berbagai perangkat-perangkat jaringan computer karena tidak akan habis dibahas
dalam satu bab.
Konsep client
server adalah koneksi dan komunikasi yang dilakukan dua computer dimana satu
sisi bertindak sebagai klien dan sisi lain sebagai server, server hanya
melayani permitaan klien dank lien mengirimkan atau meminta suatu prose pada
server. Sedangkan peer to peer adalah konsep teknologi dimana antara kedua sisi
tersebut menjadi kabur, satu sisi computer tersebut bisa berupa client dengan
meminta suatu layanan ke server dan sisi lain computer tersebut bisa berupa
server dengan menerima proses permintaan dari client.
Web dibuat
dengan suatu bahasa pengkodean HTML, agar dapat interaktif maka seorang web development
membuat suatu pemrograman agar dapat interaksi antara pengunjung dan situs
tersebut, ada banyak bahasa yang dapat digunakan seperti ASP, PHP, Javascript,
dan lain-lain.
Contohnya pada
saat kita masuk ke situs tertentu, terdapat hit counter, jam, dan bukutamu, dan
halaman polling. Lalu pertanyaan dasar gimana kita membuat ini, apakah bisa
diwujudkan dengan hanya menggunakan HTML, atau butuh suatu script lain untuk
mewujudkannya. Jawabannya dengan kode HTML ini bisa diwujudkan dengan sangat
sederhana dan terbatas kemampuannya.
:: Sekilas cara kerja Web
Pada saat kita
mengetikkan sesuatu alamat pada browser maka data akan dilewatkan oleh suatu
protocol HTTP melewati port 80 pada server. Alamat ini adalah URL dari suatu
situs yang mempunyai alamat yang unik di Internet. Web Browser akan mengirimkan
suatu aturan yang telah disepakati sebelumnyua, aturan ini biasa disebut
sebagai protocol, stadar protocol menggunakan TCP/IP, proses ini dimulaid
dengan melakukan 3 way handshakes antara sumber dan tujuan.
Web browser,
suatu aplikasi pada client yang akan menampilkan halaman web sites dari
internet. Web browser di install di sisi user (OS) menampilkan informasi ke
komputer dengan interpreting bahasa pengkodean HTML, dimana homepage berisi
gambar, suara, multimedia, dan resources lainnya yang dapat diakases.
Files Coding
pada HTML memberikan datanya ke browser apa yang akan ditampilkan ke sisi
client. Isi HTML yang akan ditampilkan bukan dari browsernya tetapi dari web
servernya dan Browser akan menginterpret tag HTML untuk link ke halaman
berikutnya
Misalnya pada
browser kita memasukan alamat www.deris.co.tv
maka yang akan terjadi adalah permintaan client akan diteruskan ke sebuah
webserver yang mempunyai alamat tertentu misalnya 202.159.31.150, agar mudah
untuk diingat maka penulisan menggunakan layanan DNS, dimana DNS untuk merubah
alamat IP tadi ke suatu kata yang mudah untuk diingat misalnya deris.co.tv.
:: Web Programming ASP
ASP
diperkenalkan ke dunia pertama kali oleh Microsoft pada tanggal 16 Juli 1996,
dan diberi nama kode Denali. Beta version dirilis pada bulan November
1996, dan akhirnya ASP Version 1.0 secara resmi dipasarkan ke publik
pada tanggal 12 Desember 1996. Microsoft terus mengembangkan ASP.
Kita dapat
menggunakan program notepad untuk menuliskan kode-kodenya dan nanti akan
dieksekusi oleh browser, namun saat ini ada banyak program untuk editor web
seperti dreamweaver yang sangat disukai penulis karena perfomanya. Agar supaya
ASP dapat dijalankan dikomputer local maka dibutuhkan suatu webserver localhost
seperti IIS (internet information server) atau PWS (Personal web server) yang
ada pada cd Windowsnya.
Seperti telah
disinggung diawal bahwa pemrograman ASP akan kita ‘sisipkan’ pada kode HTML
biasa. ASP merupakan penerjemah VBScript dan Jscript pada web server, sampai
saat ini terdapat teknologi terayar Microsoft yaitu ASP.NET yang terintegrasi
dalam Microsoft.Net.
Bila VBScript
kita gunakan untuk dieksekusi pada server, kita menamakannya ASP dan jika
dieksekusi pada klien (browser) maka kita namakan VBScript.
Contoh penulisan pertama ASP
Tag html
…
<%
Script ASP
%>
…
Tag html
Contoh penulisan VBScript
Tag html
…
<script language=VBScript) Script VBScript
</script>
…
Tag html
Setelah kita
menuliskan pada editor buatlah ekstension dengan *.asp, dan tempatkan pada
direktori yang telah kita konfigurasi di virtual direktori pada saat instalasi
webserver IIS atau PWS. Untuk kasus di LAB perhatikan penomeran IP pada
masing-masing meja computer.
Latihan 1.1 ASP.
<html>
<head>
<title> ASP
Pertamaku</title> </head>
<body>
<%
Dim halos
halos = "Hallo
dieksekusi dari server" Response.Write(halos)
%>
<hr>
<script language=VBScript> Dim haloc
haloc = "Hallo
dieksekusi dari client" Document.Write(haloc)
</script>
</body>
</html>
Namun cobalah perhatikan source code dari
tampilan 1.1, untuk melihat source dari browser client pilih View | View
Source. Maka akan terlihat seperti dibawah ini ;
Latihan 1.2 ASP.
<html>
<head>
<title><percobaan dengan
ASP></title>
</head>
<body>
<%
response.write
(
"Selamat
Datang di ASP <br> STMIK MDP Palembang <br> Jl. Rajawali"
)
%>
</body>
</html>
Latihan 1.3.
<html>
<head>
<title>Tampilan
Tanggal</title> </head>
<body>
<font size = 7
face="arial">Menampilkan tanggal hari ini</font><br>
<b>Hari
ini Tanggal </b>: <%=Date %> <br> <B>Tapi sekarang
Tanggal</b> : <%=Now %> <br> <B>Bulan sekarang
</b> : <%= month(Now) %> <br> <B>Tahun sekarang
</b> : <%= year(Now) %> <br>
<B>Bulan terbilang
</b> : <%= monthname(month(now)) %> <br> <B>Bilangan
tanggal </b> : <%= day(Now) %> <br>
<B>Jam
hari ini </b> : <%= hour(Now) %> <br> <B>Menit hari ini
</b> : <%= minute(Now) %> <br> <B>Detik hari ini
</b> : <%= second(Now) %> <br> </body>
</html>
:: Logika Pemrograman
Tipe data
digunakan misalnya untuk menyimpan data dan umumnya kita menyimpan data data
sebagai variable, variable memiliki nama dan nilai. Nama variable menentukan
bagaimana variable itu akan dipanggil dan nilainya merupakan data yang disimpan
pada variable tersebut.
Seperti bahasa
pemrograman konvensional lainnya, variable kita deklarasikan terlebih dahulu
agar nantinya dapat dieksekusi dan juga akan mempercepat waktu pengeksekusian
program.
>> Variabel
Untuk mendeklarasikan variable, kita
menggunakan statemen DIM seperti dibawah ini; Dim nama_variabel, contohnya :
Dim ilkom Dim raihan
Setelah
melakukan deklarasi barulah kita mengisikan sebuah nilai pada variable
tersebut. Untuk mengisinya kita gunakan operator penugasan (assignment
operator) seperti :
ilkom
= 15
raihan
= “nasyedman”
dari variable
diatas maka variable stmik akan menyimpan nilai numeric 15 dan variable raihan
akan menyimpan string “nasyedman”.
Ada beberapa
petunjuk pemberian nama Variabel diantaranya, harus dimulai dengan suatu
karakter alpabetik, tidak dapat mengandung titik atau karrakter untuk deklarasi
tipe, harus unik dengan jangkauan yang samaa (lihat yang dibawah ini untuk
catatan tentang jangkauan, harus berupa 255 karakter atau kurang
Contoh dalam
pendeklarasian suatu variable dalam sebuah program pendek looping , seperti
Latihan 2.1
<% dim HP
HP = “Samsung”
If HP =
“Nokia” Then %> HP kita sama donk…….. <% Else %>
HP kita lain
ya <% End If %>
Hasil : HP kita lain ya
Latihan 2.2
<html>
<head>
<title><percobaan
dengan ASP></title> </head>
<body>
<%
Dim ilkom
ilkom=
"Selamat Datang di STMIK MDP" Response.write (mdp)
%>
<BR>
<%
ilkom =
"Kampus Inderalaya" Response.write (ilkom)
%>
</body>
</html>
>> String
Digunakan untuk menyimpan data berupa
teks, karakter, maupun kumpulan karakter, penulisannya diapit dengan tanda
kutip (“), contohnya adalah ;
Latihan 2.3
<html>
<head>
<title>Fungsi STRING
</title> </head>
<body>
<script language="vbscript">
document.write
"ASCII huruf besar = " document.write asc ("Z")
document.write "<br>"
document.write
"ASCII huruf kecil = " document.write asc ("z")
document.write "<br>"
document.write
"merubah dari besar ke kecil = " document.write Lcase("ILKOM
UNSRI") document.write "<BR>"
document.write
"merubah dari kecil kebesar = " document.write UCase("FASILKOM
UNSRI") document.write "<BR>"
</script>
</body>
</html>
Latihan 2.4
<html>
<head>
<title>Fungsi STRING
</title> </head>
<body>
<script language="vbscript">
data1= "bandung lautan artis"
document.write
"menampilkan tiga dari kiri = " document.write left(data1,3)
document.write "<br>"
document.write
"menampilkan 4 dari kanan = " document.write right (data1,4)
document.write "<br>"
document.write
"menampilakn tengah = " document.write mid (data1,2,3) document.write
"<br>"
document.write
mid(data1,1,3) document.write "<br>" document.write
mid(data1,19,2) document.write "<BR>"
document.write
"mengetahui jumlah karakter di data1 = " document.write len(data1)
document.write "<br>"
</script>
</body>
</html>
Latihan 2.5
<html>
<head>
<title>Fungsi STRING
</title> </head>
<body>
<script language="vbscript">
data2 =
" Bandung Lautan Artis" document.write "menghapus spasi di
sebelah kiri = " document.write LTrim(data2)
document.write "<br>"
data3 = "ILKOM UNSRI PALEMBANG"
document.write
"menghapus spasi di sebelah kanan = " document.write RTrim(data3)
document.write "<br>"
document.write
"<br>" string1 = "dERIS " string2 =
"Deriss"
document.write
StrComp(string1, string2,1) document.write "<br>"
</script>
</body>
</html>
Latihan 2.6
<html>
<head>
<title>Fungsi STRING
</title> </head>
<body>
<script language="vbscript">
data = "x"
document.write
"menampilkan tanda x = " document.write string(95, data)
document.write "<br>"
document.write "<BR>"
document.write
"membaca deris stiawan terbalik = " data5 = "DERIS
SETIAWAN"
document.write
strreverse(data5) document.write "<br>"
</script>
</body>
</html>
Latihan 2.7
<html>
<head>
<title>Fungsi
STRING </title> </head>
<body>
<script language="vbscript">
document.write "<br>"
document.write
"menampilkan currency = " document.write formatcurrency(10000,2)
document.write "<br>"
document.write
"menampilkan tanggal longdate = " document.write
formatdatetime("27/07/2004", vblongdate) document.write
"<br>"
document.write formatpercent(30/100,2)
</script>
</body>
</html>
>> Function
Pada script VBScript ada beberapa fungsi
standar yang telah ada, kita dapat memanggil fungsi Tersebut dengan
mendeklarasikan terlebih dahulu, contohnya ;
Latihan 2.8
<html>
<head>
<title>contoh
function</title> </head>
<body>
<%
function
Hari_Esok() Hari_ini = Date() Hari_Esok = Hari_ini + 1 end Function
response.write
("<H1> Panggil Fungsi </H1>") response.write ("Besok
Tanggal : "& Hari_Esok ())
%>
</body>
</html>
Latihan 2.9
<html>
<head>
<title>contoh
function</title> </head>
<body>
<%
function
tampil() data_A = 90 data_B = 10
tampil =
data_A + data_B end Function
function
bagi() data_A = 90 data_B = 10
bagi =
data_A / data_B end Function
response.write
("<H1> HASIL </H1>") response.write ("Hasilnya
adalah : "& tampil()) response.write ("<br>")
response.write ("<hr>")
response.write ("Hasilnya bagi :
"& bagi())
%>
</body>
</html>
>> Konstanta
Beberapa
variable tidak dapat diubah nilainya selama program dieksekusi dan dapat kita
jadikan sebagai konstanta. Nilai konstanta tetap sampai program berakhir,
pendefinisian konstanta dilakukan bersama dengan pendeklarasian, contohnya ;
Const nama_konstanta = nilanya_konstanta, contohnya :
Const
pi =3.14
Konstanta
sangat berguna dalam perhitungan-perhitungan dalam matematikan and fisika.
Konstanta juga memiliki batas definisi, jadi sebuah konstanta bisa pula
memiliki btas definisi yang local maupun global, cara melakukan pembatasan ini
sama dengan pada vaiabel, yaitu ;
Public
Const pi = 3.14
Private
Const nama = “deris”
Latihan 2.10
<html>
<head>
<title>konstanta</title>
</head>
<body>
<%
Const pi = 3.14
Const kata =
“Nilai pi adalah = “ Response.write(“<h1>” & kata & pi &
“</h1>”)
%>
</body>
</html>
>> Operator
Operator digunakan untuk melakukan
beberapa operasi terhadap data,dalam VBScript dikenal beberapa operator yaitu ;
Operator
|
Kegunaan
|
|||
+
|
Penjumlahan
|
|||
-
|
Pengurangan
|
|||
*
|
Perkalian
|
|||
/
|
Pembagian
|
|||
^
|
Pemangkatan
|
|||
\
|
Pembagian integer
|
|||
=
|
Membangdingkan
|
apakah
|
data
|
disebelah
|
kirinya
sama dengan data disebelah kanan
|
||||
<>
|
Membandingkan apakah data yang disebelah
|
|||
kirinya tidak sama
dengan data disebelah
|
||||
kanan
|
||||
>
|
Membandingkan
|
apakah
|
data
|
disebelah
|
kirinya lebih besar daripada data disebelah
|
||||
kanan
|
||||
>=
|
Membandingkan
|
apakah
|
data
|
disebelah
|
kirinya
lebih besar atau sama dengan data
|
||||
disebelah
kanan
|
Contoh dalam penulisan ; 2+3 = 5 2^3 = 8
10/3 = 3.3333 10\3 = 3
>> Pernyataan Kondisi
Kondisi
digunakan jika terdapat struktur program yang harus dipilih salah satu sebelum
menuju bagian berikutnya, ini sering kita dengar pada pemrograman lainnya
seperti If…then….Else dan Select…Case
Latihan 2.11
<html>
<head>
<title>if
then</title> </head>
<body>
<%
Function
halo_nama(nama) If nama = "Deris" Then halo_nama = "Hallo"
& nama End if
end function
Response.write("<h1>Panggil
Fungsi !</h1>") Response.write(halo_nama("Deris"))
%>
</body>
</html>
Latihan 2.12
<html>
<head>
<title>If...Then...Else</title> </head>
<body>
<%
Function
halo_nama(nama) If nama = "Deris" Then
halo_nama = "Haloo " & nama ElseIf nama =
"Stiawan" Then
halo_nama = "Haloo " & nama
& ", nama deris"
Else
Halo_nama
= "Maaf Anda tidak dikenal,siapanih" End If
End Function
Response.write("<h1>Panggil
fungsi !</h1>") Response.write("<h1>Jika nama adalah
Deris</h1>") Response.write(halo_nama("Deris"))
Response.write("<h1>Jika nama adalah Stiawan</h1>")
Response.write(halo_nama("Stiawan"))
Response.write("<h1>Jika nama adalah Anonymous</h1>")
Response.write(halo_nama("anonymous"))
%>
</body>
</html>
Latihan 2.13
<html>
<head>
<title>contoh
function</title> </head>
<body>
<script
language="vbscript"> document.write "<b>"
document.write "<center>"
document.write
"proses pengulangan for..next" document.write "<hr>"
document.write "</center>"
for angka = 1 to 100 step 2 document.write angka document.write
"<br>"
next
</script>
</body>
</html>
Latihan 2.14
<html>
<head>
<title>contoh
function</title> </head>
<body>
<script
language="vbscript"> document.write "<b>" document.write
"<center>"
document.write "proses
pengulangan for..next" document.write "<hr>"
document.write "</center>"
dim x(10)
a=0
do
x(A) = 10 *
a a = a + 1
document.write " nomor
index ke :" & a document.write "<br>"
loop until a = 10000
</script>
</body>
</html>
Latihan 2.15
html>
<head>
<title>contoh
function</title> </head>
<body>
<%
Function hai_nama(nama) select case UCASE(nama) case "STMIK
MDP"
hai_nama
= "halloo....." & nama & ", bapak FASILKOM UNSRI"
case "ILKOM UNSRI"
hai_nama = "halloo......." & nama & ",
ibu ILKOM UNSRI"
case else
hai_nama
= "Maaf , anda tidak dikenal" end select
end function
response.write ("<H1> Jika Nama Adalah FASILKOM UNSRI
</H1>")
response.write (hai_nama ("ilkom
unsri"))
response.write ("<H1> Jika Nama Adalah ILKOM UNSRI
</H1>")
response.write
(hai_nama ("ilkom unsri")) response.write ("<H1> Jika Nama
Adalah anonymous </H1>") response.write (hai_nama
("anonymous"))
%>
</body>
</html>
:: Object Built In
Seperti yang
telah disinggung sebelumnya bahwa dalam VBScript terdapat objek-objek yang
dapat digunakan untuk membuat program (object built in),objek-objek tersebut
dapat digunakan untuk mengumpulkan data permintaan browser, menyimpan informasi
browser, dan lain-lain masih banyak lagi, ada beberapa object built in yang
akan kita bahas dalam bagian ini, diataranya;
>> Input Output
Pastilah kita
pernah mengunjungi situs tertentu dan melihat beberapa kotak dialog seperti
input nilai, inputkan nama, dan lain-lain seperti di VB. Mekanisme ini
digunakan untuk berkomunikasi dengan pengujung dengan menggunakan MsgBox dan
InputBox, MsgBox digunakan untuk menampilkan sejumlah pesan kepada pengunjung
sedangkan Input Box digunakan untuk memperoleh masukan dari pengunjung
Untuk membuat MsgBox seperti gambar 3.1 dapat kita coba latihan
dibawah ini ;
Latihan 3.1
<html>
<head>
<title>Contoh Message</title>
</head>
<body>
<script language="vbscript">
msgbox "SELAMAT DATANG
DI ASP" + CHR(13) + "THE POWER
MICROSOFT",vbcritical,"informasi"
msgbox
"SAMA-SAMA",0,"informasi" </script>
</body>
</html>
Cara penulisan dalam membuat MsgBox adalah ;
MsgBox(Prompt[,buttons][,title][,helpfile,
contex_id]) atau
bisa juga MsgBox “[pesan]”, kode icon + kode tombol,”[judulnya]”
Yaitu;
Prompt : teks yang akan ditampilkan pada
bagian body dari message Buttons : mengatur tampilan tombol,icon dan modilariti
MsgBox Title : judul yang akan ditampilkan pada MsgBox
Helpfile : nama dari file help yang akan
dibuka bila pengguna menekan tombol F1 Context_id : identitas yang berhubungan
dengan file help yang telah dispesifikasikan. Sedangkan untuk membuat tampilan
seperti gambar 3.2 dapat kita perhatikan script dibawah ini, pada latihan
3.2 ;
<html>
<head>
<title>Contoh
Message Input Data</title> </head>
<body>
<script language="vbscript">
nama =
inputbox("Your Name","identity") address =
inputbox("Your Address","identity")
msgbox
"Your Name = "+ nama + chr (13) + " Your address =" +
address,vbinformation,"Informations"
</script>
</body>
</html>
Cara penulisan input box adalah ;
Nama
variable = inputbox “[pesan]”,”[judul]”
>> Objek Form
Sebelum kita
membicarakan objek pada form, ada beberapa control HTML yang nantinya akan kita
gunakan untuk membangun aplikasi dengan ASP. Penggunaan pada tag ini dimulai
dengan <input> dan dikuti dengan tag yang akan kita masukan pada sebuah
form.
Ada beberapa control form pada HTML, diantaranya adalah ;
Text boxes : <input>
Text areas : <textarea>
Radio Buttons : <input> dengan type set radio
Check Boxes : <input> dengan type set checkbox
List Boxes : <select>
Submit buttons : <input> dengan type set submit
Normal buttons : <input> dengan type set button
Reset buttons : <input> dengan type set reset
Objek form
digunakan untuk berkomunikasi dengan form pada dokumen HTML. Objek ini memiliki
suatu metode submit, yang berfungsi untuk mengirimkan form, eventnya yaitu
onSubmit. Ada beberapa property dari objek form, yaitu ;
Property
|
Keterangan
|
Action
|
Halaman tujuan dari form
|
Method
|
Metode
request dari form
|
Encoding
|
Encoding
Form
|
Dalam sebuah
form banyak memiliki elemen-elemen input, agar para pengunjung dapat
berkomunikasi dengan elemen ini kita harus membuatkan beberapa
property-properti, metode dan event, seperti dibawah ini ;
Elemen
|
Property
|
Metode
|
Event
|
|
Button,
|
reset,
|
Form,name,value
|
Click
|
Onclick
|
submit
|
||||
Checkbox
|
Form,name,
|
Click
|
Onclick
|
|
checked,
default
|
||||
checked
|
||||
Radio
|
Form,name, value,
|
Click, focus
|
Onclick
|
|
checked
|
||||
Password
|
Form,name, value,
|
Focus, blur,select
|
-
|
|
default
value
|
||||
Text,textarea
|
Form,name, value,
|
Focus, blur,select
|
Onfocus, onblur
|
|
default
value
|
Onchange,onselect
|
|||
Select
|
Name, length,
|
Focus, blur
|
Onfocus, onblur
|
|
option,selectedIndex
|
Onchange
|
|||
Hidden
|
Name, value
|
-
|
-
|
Latihan 3.3
<Html>
<Head>
<Title>Daftar
Mahasiswa</Title> </Head>
<Body>
<Center>
<H1>
Daftar Mahasiswa<Br>
Diploma Komputer UNSRI<Br>Inderalaya
</Center></H1>
<hr>
<Form Method="Get"
Action="TampilMahasiswa.Asp"
Name="FrmMahasiswa">
<Table>
<Td>Npm</Td><Td>:</Td><TD><Input
Type="Text" Name="TxtNpm" Size=12></Td><TR>
<Td>Nama
Mahasiswa</Td><Td>:</Td><TD><Input
Type="Text"
Name="TxtNama"
Size=25></Td><TR>
<Td>Alamat</Td><Td>:</Td><TD><Input
Type="Text"
Name="TxtAlamat"
Size=35></Td><Tr>
<Td>Hobby</Td><Td>:</Td><TD><Input
Type="Text"
Name="TxtHobby"
Size=45></Td><TR>
<Td>Dosen
Favorit</Td><Td>:</Td><TD><Input
Type="Text"
Name="TxtDosen"
Size=12></Td><TR>
<Td>Kritik</Td><Td>:</Td><TD><textarea
rows="4" name="Kritik"
cols="20"></textarea></TD><TR>
<TD Colspan=3 align=middle>
<Input
Type="Submit" Value="Simpan" Name="CmdSimpan">
<Input Type="Reset" Value="Batal"
Name="CmdBatal"></TD>
</Table>
</Form>
</Body>
</Html>
Dari latihan
diatas dapat dilihat bahwa kita akan membuat tampilan dengan nama maha.asp dan
akan ditampilkan pada halaman berikutnya dengan nama tampilmahasiswa.asp.
perhatikan action pada script diatas. Maka pada saat kita mengisikan pada
setiap kolom dihalaman maha.asp maka akan dikirimkan ke halaman tampilmahasiswa.asp
dalam bentuk teks yang kita deklarisikan sesuai dengan nama kolom tersebut.
Sedangkan pada
script dibagian akhir terdapat input type= ‘submit” untuk membuat tombol dengan
tampilan simpan dan namanya “Cmdsimpan”. Sedankan tombol dengan tampilan reset
untuk menghilangkan nilai yang dimasukan user.
Tampilmahasiswa.asp
<Html>
<Head>
<Title>Daftar
Mahasiswa</Title> </Head>
<Body>
<Center>
<H1>
Daftar
Mahasiswa<Br> Diploma Komputer </Font> </Center></H1>
<hr>
<Table>
<Td>Npm</Td><Td>:</Td><TD>
<%=Request.QueryString("TxtNpm")%></Td><TR>
<Td>NamaMahasiswa</Td><Td>:</Td><TD>
<%=Request.QueryString ("TxtNama")%></Td><TR>
<Td>Alamat</Td><Td>:</Td><TD>
<%=Request.QueryString("TxtAlamat")%></Td><Tr>
<Td>Hobby</Td><Td>:</Td><TD>
<%=Request.QueryString("TxtHobby")%></Td><TR>
<Td>Dosen
Favorit</Td><Td>:</Td><TD>
<%=Request.QueryString("TxtDosen")%></Td><TR>
<Td>Kritik</Td><Td>:</Td><TD>
<%=Request.QueryString("Kritik")%></TD><TR>
</Table>
<A
Href="Maha.asp">Kembali Ke Data Mahasiswa TI 71</A>
</Body>
</Html>
Dari script tampilmahasiwa diatas dapat
kita lihat bahwa pada saat kita mengirimkan dari halaman ‘maha.asp’ dengan method
= “Get”, maka pada tscript ‘tampilmahasiswa.asp’ kita tuliskan script
<%=Request.QueryString(“vardata”)%>
Jadi yang harus diperhatikan adalah
penulisan “name” pada inputtype halaman sebelumnya.
>> Proses Input Form
Dari contoh
sebelumnya telah kita lihat beberapa contoh yang mengandung form. Jika kita
perhatikan maka terdapat tag seperti <FORM METHOD = “POST | GET “ ACTION
=
“NAMEFILE.ASP”
Proses
terhadap input dilakukan dengan menggunakan objek Request. Input form tersebut
akan ditampung oleh koleksi QueryString dan koleksi Form. Perbedaan menggunakan
kedua koleksi ini tergantung pada parameter METHOD dan FORM.
Jika kita
perhatikan pada contoh latihan 3.3, dimana pada halaman ‘tampilmahasiswa’
terdapat vardata yang digunakan untuk menampung data yang akan diambil.
Misalnya pada halaman ’maha.asp’ data yang menampung nama adalah komponen
<INPUT TYPE=text> yang diberi NAME=namamahasiwa. Maka untuk mengambilnya
<%=Request.QueryString
("TxtNama")%>
Sekarang kita
masih menggunakan koleksi QueryString namun bedanya metode yang dikirimkan
menggunakan POST bukan GET.
Latihan 3.4
Form.asp
<Html>
<Head>
<Title>Daftar
Mahasiswa</Title> </Head>
<Body>
<Form
Method="POST" name="form" Action="proses.asp"
Name="FrmMahasiswa">
Nama depan <input type="text"
name="nama"> <br>
Nama
keluarga <input type="text" name="keluarga">
<br> Umur <input type="text" name="umur">
<br>
<Input Type="hidden"
Value="new" Name="status">
<Input
Type="submit" Value="Batal"
Name="CmdBatal"></TD> </Form>
</Body>
</Html>
Proses.asp
<Html>
<Head>
<Title>Daftar
Mahasiswa</Title> </Head>
<Body>
hallo,
<%=Request.FORM("nama")%>
<%=Request.FORM("keluarga")%><br>
anda saat ini berusia
<%=Request.FORM("umur")%> tahun. <br>
<%
if Request.FORM("status") =
"new" then
response.write"
ini adalah kunjungan pertama anda !" end if
%>
</body>
<html>
Apa
perbedaannya, jika kita perhatikan pada saat dijalankan dibrowser dengan
mekanisme FORM maka yang tidak tampak atau tertulis query string
yang panjang,
berbeda jika kita menggunakan mekanisme GET yang akan menampilkan query
string yang panjang pada address browser.
>> Verifikasi Input Form
Untuk contoh awal buatlah script dibawah ini,
Latihan 3.5
<html>
<head>
<title>contoh
function</title> </head>
<body>
<script language="vbscript">
function login_onsubmit
if document.login.txtlogin.value =" " then
login_onsubmit = false
msgbox
"Maaf Login Harus Diisi..",48+1,"Konfirmasi" else
if
document.login.txtpass.value =" " then login_onsubmit = false
alert
"Password Harus Diisi.." else
if document.login.txtlogin.value
="Deris" then
if
document.login.txtpass.value ="Stiawan" then login_onsubmit = True
else
login_onsubmit = false
msgbox
"Password Anda Salah",vbcritical end if
else
login_onsubmit = false
msgbox "Maaf Login
Salah",vbcritical
end if end if end if
end function
</script>
<Form
method="POST" Action="Tampilan.asp" name="LOGIN"
<Table Border=1>
<tr>
<td><b>Login
</td></b><td><Input Type="text"
Name="txtlogin" Size=10></td>
</tr>
<br>
<tr>
<td><b>Password
</td></b><td><Input Type="password"
Name="txtpass" Size=10></td>
</tr>
</Table>
<br>Input
Type="Submit" value="Kirim" Name="BtnKirim">
<Input Type="Reset" Value="Batal"
Name="BtnBatal"> </form>
</html>
Latihan 3.6
<html>
<head>
<title>Objek
form</title> </head>
<body>
<h1>Objek
form</h1> <hr>
<form
name="formku" action="test.asp" method="post">
<pre>
Login
<input
type="text" name="nama"> <input
type="submit" value="Kirim"> </form>
</pre>
<script
language=VBScript> Function formku_onSubmit
If
Document.formku.nama.value = "" Then formku_onSubmit = False
Alert "Anda belum mengisi nama
login"
Else
formku_onSubmit = True End If
End Function
</script>
</body>
</html>
Thanks for reading & sharing Kamar Pekick
0 komentar:
Post a Comment