58362330 Buku ASP Terbaru A

LEMBAGA BAHASA & PENDIDIKAN PROFESIONAL (LBPP-LIA)

BAB IPENGENALAN ACTIVE SERVER PAGES (ASP)

I.1 Pendahuluan Sebelum kita masuk ke pemrogramman ASP, kita harus mengenal dulu apa ASP itu dan apa kegunaannya serta kelebihannya. Dengan demikian, kita dapat mengetahui bayangan mengenai ASP. ASP adalah salah satu teknologi yang dikembangkan oleh Microsoft yang diluncurkan pada tahun 1996. ASP merupakan teknologi Server-side scripting, yang artinya segala proses programmnya dilakukan di server sebelum dikirim ke client. Client akan menerima hasil keluaran dalam bentuk HTML biasa. Server side scripting ini merupakan kebalikan dari client side scripting, yang seluruh proses programmnya dilakukan di client. ASP adalah bahasa pemrograman untuk membangun aplikasi web (internet). Ada beberapa bahasa program yang lain yang dapat digunakan untuk membangun aplikasi web seperti : PHP, Perl, Coldfusion dll. Tetapi untuk di lingkungan Sistem operasi Windows, ASP adalah bahasa yang digunakan untuk membangun aplikasi Web (Internet). ASP ini sudah banyak digunakan untuk membuat aplikasi yang berhubungan dengan database, baik menggunakan Microsoft Access database hingga SQL server atau ORACLE database. Scripting yang paling banyak digunakan dalam menulis ASP ini adalah Vbscript. Bahasa ASP murni Object Oriented Programming (OOP). Struktur bahasanya sama dengan Bahasa Pemrograman Visual Basic yang mudah dimengerti karena sintaksnya menggunakan bahasa Inggris. Oleh karena itu ASP sangat mudah dipelajari oleh para pemula sekalipun untuk membuat aplikasi web. Hypertext Markup Langguage (HTML) adalah bahasa standar penulisan dokumen web agar dapat ditampilkan pada browser. Script adalah potongan program kecil yang disisipkan pada dokumen web sehingga halaman web menjadi lebih interaktif. Jadi Program ASP disisipkan pada Bahasa HTML agar dapat ditampilkan pada Browser. I.2 Persyaratan yang dibutuhkan

Pemrograman Web dengan Active Server Pages (ASP)

1


Agar dapat membuat program web menggunakan ASP, ada beberapa persyaratan yang harus terpenuhi yaitu : I.2.1 Web Server Local Untuk dapat menguji script yang kita buat, diperlukan sebuah Web Server. Sebagai sarana latihan, cara yang paling mudah dalam melakukan percobaan adalah secara local, dengan menggunakan Personal Web Server (PWS) atau Internet Information Server (IIS) sebagai web server local. Sehingga script ASP yang dibuat dapat dipastikan berjalan sesuai dengan harapan sebelum di upload ke Internet. Setelah semua aplikasi berjalan normal di server local, kita dapat mengirim file-file tersebut ke server Internet yang dapat di akses oleh umum (Public). PWS atau IIS yang kita pilih sebagai web server local, tidak jadi masalah dalam pembuatan aplikasi ini nantinya. Untuk PWS, kita dapat temukan dalam CD lengkap dari Microsoft Windows 95/98 di Direktori Add-Ons, sedangkan IIS terdapat pada Microsoft Windows 2000. Berikut ini adalah langkah-langkah instalasi Web Server Local : A. Instalasi Personal Web Server 4.0 (PWS 4.0) pada Microsoft Windows 95/98 1. Masuk ke dalam direktori add-ons, kemudian jalankan file setup.exe. Akan muncul tampilan pembukaan yang menampilkan informasi bahwa fasilitas yang diberikan dalam PWS diantaranya adalah Personal Web Server, Transaction Server, Data Acces Components, Message Queue Server Client dan Easy Administration. Pilih tombol Next untuk memulai instalasi atau Cancel untuk membatalkan.


2


Gambar I.1. Tampilan Awal pada saat menginstal Personal Web Server

2. 3.

Permintaan untuk memilih tipe instalasi yang diinginkan (minimum, typical dan custom). Untuk hal ini pilih saja typical. Setelah Kita memilih typical, maka akan muncul permintaan untuk informasi folder yang akan digunakan sebagai home directory dari WWW Service. Disitulah tempat penyimpanan semua dokumen web yang akan ditampilkan oleh web browser (Internet Explorer, Netscape, dll.). Untuk directory Default adalah C:\Inetpub\wwwroot. Kita dapat mengubahnya jika perlu. Setelah itu kita klik Next untuk melanjutkan instalasi. Pada tahap ini dilakukan instalasi berdasarkan pada pilihan sebelumnya. Instalasi PWS dapat dilihat melalui current status dan progress bar biru yang berjalan. Jika Instalasi telah berjalan dengan baik dan benar, maka akan ditampilkan pesan bahwa instalasi PWS telah selesai dan kita diminta untuk menekan tombol finish untuk keluar dari instalasi. Default direktori C:\Inetpub\wwwroot

4.

5.

Gambar I.2. Personal Web Server (PWS) Manager


3


6. Selanjutnya, Personal Web Server Manager akan muncul setiap kali kita merestart computer. Program inilah yang menjadi pusat control pengaturan web server pada PWS. Pada tampilan utama PWS (Gambar I.2.) dapat kita temukan pusat direktori yang telah dipilih pada langkah ke 3 yaitu : C:\Inetpub\wwwroot. Pusat direktori tersebutlah akan menjadi tempat penyimpanan script-script ASP yang akan dibuat nantinya. Untuk membuat proyek yang lain, disarankan untuk membuat subdirektori di dalam folder C:\Inetpub\wwwroot untuk setiap proyek yang dibuat. Misalkan, direktori C:\Inetpub\wwwroot\perpustakaan untuk semua latihan yang berkaiatan dengan aplikasi perpustakaan. Sehingga untuk mengakses script-script ASP tersebut melalui Browser, cukup dengan menuliskan : http://localhost/perpustakaan pada kotak alamat setiap browser. Catatan Untuk menjalankan program di Browser, perintah C:\Inetpub\wwwroot\perpustakaan dapat diganti dengan http://localhost/perpustakaan/(nama file) Contoh : http://localhost/perpustakaan/coba.ASP http://localhost

Gambar I.3. Penulisan URL untuk Akses Local

B. Instalasi Internet Informastion Service 5.0 (IIS 5.0) pada Microsoft Windows 2000 1. Buka control panel (Start Settings Control Panel) dan pilih icon Add/Remove Programs. Maka akan muncul gambar di bawah ini.


4


Gambar I.4. Tampilan Add/Remove Programs

2. Pilih Add/Remove Windows Components yang terletak pada sebelah kiri. Maka akan terbuka dialog screen seperti di bawah ini.

Gambar I.5. Tampilan Windows Components Wizard

3. Pilih Internet Information Services (IIS). Jika sudah dicheckbox, maka IIS sudah terinstall. Jika belum, maka periksa Internet Information Services (IIS) option kemudian klik details, maka akan keluar dialog screen seperti di bawah ini.


5


Gambar I.6. Tampilan Internet Information Services (IIS)

4. Pilih semuanya untuk mendapatkan semua fungsi dan feature dari IIS. Kilk OK, maka dialog box akan berpindah ke sebelumnya. Geser scroll bar ke bawah, periksa Script Debugger option. Script debugger memungkinkan kita untuk melakukan debug pada script ASP kita.

Gambar I.7. Tampilan Script Debugger yang sudah terpilih pada Windows Components Wizard

5. Klik next, maka sistem akan menginstruksikan kepada kita untuk memasukkan Windows 2000 Installation CD ke dalam CDROM. Setup akan memakan waktu beberapa menit untuk menyelesaikannya. 6. Setelah instalasi selesai buka windows explorer, maka folder C:\Inetpub sudah langsung terbentuk. Berikut fungsi singkat masing-masing folder : \iisamples\homepage berisi ASP sample pages. \iisamples\sdk berisi subdirektori yang menyimpan ASP script yang mendemonstrasikan beberapa ASP object dan komponen.Pemrograman Web dengan Active Server Pages (ASP) 6


\scripts isinya direktori kosong yang berguna untuk menyimpan script yang sudah dibuat. \webpub isinya juga direktori kosong yang digunakan untuk feature Publish Wizard. Hanya ada jika kita menggunakan Windows 2000 Professional Edition. \wwwroot direktori ini merupakan top folder untuk website anda. Ini menjadi default web directory. Kita bisa membuat sub directory di sini untuk membangun website. \ftproot, \mailroot dan \nntproot merupakan direktori yang berisi ftp, mail dan news service.

7. Kita bisa mencoba apakah web server sudah terinstalasi dengan baik atau tidak. Oleh karena itu cobalah buka Internet Explorer. Ketik pada kolom address. http://localhost atau http://namakomputer, jika berhasil maka akan tampil layar seperti gambar di bawah ini.

Gambar I.8. Tampilan IIS 5.0 yang sudah terinstall

I.2.2 Editor Script ASP ditulis dalam bentuk teks murni seperti HTML. Kita dapat menggunakan sembarang editor teks untuk menyunting file-file ASP, misalnya Notepad, Ultra Edit dll. Kita dapat pula menggunakan editor yang dirancang khusus untuk membuat halaman-halaman web HTML dan script seperti Microsoft FrontPage dan7



Macromedia Dreamweaver. Untuk penulisan script ini kita menggunakan Text Editor Ultra Edit.

Gambar I.9. Tampilan Text Editor Ultra Edit

I.2.3 Browser Browser digunakan untuk mencoba script ASP yang dibuat. Kita dapat menggunakan sembarang browser seperti Internet Explorer, Netscape Navigator, dll. Pembahasan di buku ini menggunakan Internet Explorer (IE). I.3 Bagaimana ASP Bekerja Script ASP yang telah dibuat, tidak dapat langsung dijalankan di sebuah komputer menggunakan browser, karena menerjemahkan script ASP memerlukan server tersendiri. Script-script ASP diproses di sebuah server web, hasilnya barulah dikirimkan ke client dalam format HTML. Oleh karena itulah halaman web yang mengandung ASP dapat dibuka oleh browser manapun, karena output yang ditampilkan di browser adalah dokumen HTML. Pada Windows 2000, pustaka pengeksekusi script-script ASP adalah ASP.DLL yang secara default terinstal pada direktori WINNT\System32\inetsrv. Ketika ada permintaan dari client untuk membuka suatu halaman yang berisi script ASP, IIS akan memerintahkan kepada file tersebut untuk mengeksekusi script-script yang ada. Setelah selesai, hasilnya digabungkan dengan kode HTML yang ada membentuk sebuah dokumen HTML yang komplit. Dokumen yang komplit tersebut lalu diserahkan kepada server web untuk diteruskan kepada client yang memintanya.


8


Jenis script yang diolah seperti ASP disebut dengan Script serverside. Script ASP berbeda dengan VBScript atau JavaScript yang diolah dan dilihat hasilnya langsung di browser. Jenis script seperti VBScript dan JavaScript disebut dengan script clintside.

Gambar I.10. Proses Script ASP pada Server Web

BAB IIHYPERTEXT MARKUP LANGUAGE (HTML)II.1 Pendahuluan Halaman Active Server Pages (ASP) adalah dokumen aktif yang berisi script ASP dan HTML atau script lainnya yang terlebih dahulu diproses oleh server pada saat request terhadap dokumen tersebut. Dikatakan halaman aktif, karena script ASP dalam dokumen tersebut memiliki kemampuan untuk berinteraksi dengan database apapun serta menampilkan data secara dinamis dalam format HTML. Dokumen ASP itu sendiri pada dasarnya adalah dokumen HTML yang di dalamnya disisipkan script ASP dan memiliki ekstensi file *.asp. Dengan demikian untuk dapat mempelajari ASP adalah mutlak mengenal script HTML yang merupakan elemen dasar scripting internet.


9


HTML Perkembangan Internet yang sangat pesat tidak terlepas dari World Wide Web (WWW), yang merupakan salah satu bagian dari Internet. WWW membawa perubahan drastis pada Internet dengan kemampuanya untuk menampilkan komponen-komponen multimedia yang interaktif di Internet. WWW sendiri juga tidak terlepas dari HTML (Hypertext Markup Language) yang merupakan dasar untuk membangun suatu situs Web. Arti HTML dapat dipelajari dari setiap elemennya, yaitu : HyperText WWW memungkinkan penggunanya untuk melompat dari suatu lokasi ke lokasi lain. Ini dapat terjadi karena adanya hypertext link, yaitu suatu teks yang berfungsi sebagai suatu link (penghubung) dari suatu lokasi dalam Web ke lokasi lainnya. Dengan kemampuan multimedia dalam Web, istilah ini kemudian berkembang menjadi hypermedia link. Untuk menyederhanakan, kedua istilah ini dipadukan menjadi hyperlink atau biasa disebut link saja. Markup Untuk membuat suatu link, teks tebal, teks miring, atau komponen-komponen Web lainnya dilakukan dengan cara memberikan tanda pada link atau teks yang akan dibuat tebal atau miring tersebut. Tanda-tanda ini disebut sebagai markup tag atau biasa disingkat tag. Language Sekalipun didefinisikan sebagai suatu Language (bahasa), tetapi sebetulnya HTML bukanlah suatu bahasa pemrograman. Kita tidak perlu menjadi seorang programmer untuk mempelajari HTML, yang kita lakukan hanyalah memberikan tanda atau tag pada suatu bagian tertentu dari teks. II.2 Struktur Dokumen HTML HTML adalah Scripting yang digunakan untuk mengatur format dokumen dalam halaman web. Script ini menggunakan markup untuk menandai perintah-perintahnya. Di bawah ini adalah struktur dari dokumen HTML. Kepala Dokumen Struktur HTML
Isi dokumen


10


Pada contoh di atas dapat dilihat bahwa dokumen HTML diawali dengan tag dan diakhiri dengan tag . Dua bagian di atas adalah bagian kepala dokumen yang berisi informasi tentang informasi dokumen seperti keywords dan description, dll. Sedangkan untuk bagian yang diapit dengan tag adalah bagian untuk menuliskan judul dokumen. Dan bagian yang diapit oleh tag adalah bagian yang berisi seluruh informasi yang hendak disajikan. Tidak semua tag HTML ditulis dalam bentuk berpasangan, yaitu dengan tag awal dan tag akhir. Beberapa tag tidak mempunyai tag akhir, jadi hanya terdiri dari tag awal saja. Contoh tag tunggal adalah , digunakan untuk membuat suatu garis horizontal. II.2.1 Heading Heading ditandai dengan tag sampai dengan , tag ini digunakan untuk menampilkan bagian tertentu yang dianggap sebagai judul atau topic. Penggunaan tag s/d memberikan efek perubahan ukuran huruf. Penggunaannya adalah sebgai berikut : Headings Heding 1 Heding 2 Heding 5
Heading 1 (Align Left) Heading 2 (Align Right) Heading 5 (Align Center)


11


Gambar II.1. Hasil Eksekusi Program HTML pada Browser Internet Explorer (IE)

II.2.2 List Dokumen Untuk menampilkan dokumen secara list dapat digunakan tag dan diakhiri dengan . Penggunaan tag ini adalah sebagai berikut : contoh5.html Tipe 1 (Numerik) Ms.Word Ms.Excel Ms.Powerpoint Ms.Outlook Ms.Acces Tipe A dan a (Alpabetik) Ms.Word Ms.Excel TYPE=a>Ms.Powerpoint TYPE=a>Ms.Outlook Ms.Acces

Tipe I dan i (Romawi) Ms.Word Ms.Excel TYPE=I>Ms.Powerpoint TYPE=I>Ms.Outlook Ms.Acces


12


Gambar II.2. Hasil Eksekusi HTML pada Browser untuk Tipe Penomoran

II.2.3 Paragraf Untuk memberikan format paragraf pada teks dapat menggunakan tag . Tag ini memiliki beberapa atribut yang memberikan alignmen teks, yaitu Align="Left", Align="Right", Align=Center". Penggunaannya adalah sebagai berikut : Dalam upaya meningkatkan peran serta LBPP-LIA untuk mencetak tenaga professional siap kerja yang memiliki kompetensi dalam menembus pasaran kerja, maka dirancang suatu program pendidikan keterampilan yang mengacu pada kebutuhan dunia usaha. Program Pendidikan Profesional Satu Tahun LBPP-LIA menyelenggarakan beberapa jurusan profesi siap kerja yaitu : Manajemen Informatika, Akuntansi Komputer, Sekretaris & PR, Perhotelan, Tour & Travel,Pemrograman Web dengan Active Server Pages (ASP) 13


Bahasa Inggris, Pendidikan Profesional Satu tahun yang diadakan oleh LBPP-LIA adalah pendidikan yang mengikuti kecepatan perkembangan industri yang bertujuan meningkatkan sumberdaya manusia.

Gambar II.3. Hasil Eksekusi HTML pada Browser untuk Format Paragraf

II.2.4 Memformat Karakter Format terhadap karakter yang ditampilkan akan berguna untuk membuat dokumen HTML yang menarik. Pemformatan karakter tersebut mencakup beberapa hal, yaitu: 1. Logical Format 2. Physical Format 3. Tag 4. Tag 5. Karakter Khusus 1. Logical Format Logical format akan menerapkan layout dokumen secara logis dan terstruktur. Tag-tag yang termasuk logical format adalah sebagai berikut:Pemrograman Web dengan Active Server Pages (ASP) 14


Tag Contoh :

Kegunaan Untuk menandai suatu kutipan (Citation) Untuk menampilkan kode-kode pemrograman, misalnya bahasa C. Untuk menandai suatu teks yg ditekankan oleh penulis. Untuk menandai suatu teks yg harus dimaksudkan sebagai contoh Untuk menandai bagian yang terpenting dari suatu teks. Untuk menampilkan nama variable Untuk menandai sebuah subdefinisi dari daftar definisi.

Logical Format Sondang Sibuea adalah penyusun buku ASP

Pertama dipelajari oleh programmer C adalah puts(Hallo teman!);

Ia berkata, Cinta adalah segalanya

Untuk berpindah ke direktori root, ketik cd /.

Hal yang paling penting adalah Percaya diri

Program tersebut dilakukan pengulangan sebanyak N kali.

Cicak adalah hewan pemakan nyamuk

Gambar II.4. Hasil Eksekusi HTML pada Browser untuk Logical Format

2. Physical FormatPemrograman Web dengan Active Server Pages (ASP) 15


Physical format adalah format terhadap fisik suatu font. Tag-tag yang termasuk physical format adalah sebagai berikut : Tag Contoh : Physical Format Ini adalah huruf tebal Ini adalah huruf miring Huruf ini mirip dfengan huruf mesin ketik Kalimat ini akan diberi garis bawah Kalimat ini diberi garis bawah pada bagian tengan Huruf ini berukuran lebbih besar Huruf ini berukuran lebih kecil Ini adalah Subscript Ini adalah superscript

Kegunaan Untuk menampilkan huruf tebal Untuk menampilkan huruh miring Untuk menampilkan huruf seperti mesin tik Untuk menampilkan huruf dengan garis bawah Untuk menampilka garis horizontal pada bagian tengah huruf. Untuk menampilkan ukuran huruf yang lebih besar Untuk menampilkan ukuran huruf yang lebih kecil Untuk menampilkan subscript Untuk menampilkan superscript


16


Gambar II.5. Hasil Eksekusi HTML pada Browser untuk Physical Format

3. Tag Tag digunakan untuk menandai bagian yang dikhususkan pada sebuah dokumen, misalnya kutipan-kutipan dari kitab suci atau kata-kata mutiara, dan lain-lain. Biasanya teks yang diberi tag ini lebih menjorok ke dalam (indent). Contoh: Penggunaan Blockquote Definisi Cinta menurut Mbah Suro : Cinta adalah Sesuatu yang indah, jadi hati-hatilah dengan cinta, jangan sampai terluka atau ternoda, apabila cinta terluka atau ternoda,cinta berubah jadi neraka.(Kaciaaan de lho)

Gambar II.6. Hasil Eksekusi HTML pada Browser untuk penggunaan

4. Tag Font Tag untuk mengatur jenis, ukuran dan warna Font. Penggunaan tag ini adalah sebagai berikut : Pemrograman Web dengan Active Server Pages (ASP) 17


Nama font adalah nama font yang ter-install pada komputer. Ukuran font adalah nilai angka 1 sampai dengan 7. Warna dapat digunakan bilangan heksadesimal yang terdiri dari 6 digit dan diawali dengan karakter #. Dua digit pertama mewakili warna merah, dua digit kedua mewakili warna hijau, dua digit terakhir mewakili warna biru. Untuk mempermudah penggunaan warna maka HTML mendefinisikan 16 warna untuk warna-warna standar, yaitu; NO 1. 2. 3. 4. 5. 6. 7. 8. 9. 10. 11. 12. 13. 14. Contoh: Penggunaan tag Arial Monotype Corsiva Times New Roman

WARNA Black (Hitam) Maroon (Merah Tua) Green (Hijau) Olive (Hijau Kekuningan) Navy (Biru Gelap) Purple (Ungu) Teal (Biru Kehijauan) Gray (Abu-abu) Silver (Perak) Red (merah) Lime (Hijau Terang) Yellow (Kuning) Blue (Biru) Fuchsia (Merah Keunguan)

HEXA #000000 #800000 #008000 #808000 #000080 #800080 #008080 #808080 #C0C0C0 #FF0000 #00FF00 #FFFF00 #0000FF #FF00FF


18


Gambar II.7. Hasil Eksekusi HTML pada Browser untuk Penggunaan Tag

5. Karakter Khusus Kadang-kadang dalam suatu dokumen HTML ingin ditampilkan karakter-karakter tertentu, misalnya tanda lebih kecil, tanda lebih besar, tanda drajat atau tanda lainnya. HTML telah menyediakan beberapa symbol untuk menampilkan karakter-karakter tersebut, beberapa diantaranya : Simbol &yen &frac12 ; &pi < > & Karakter < > &

Daftar karakter yang lebih lengkap dapat kita lihat pada alamat : http://www.w3.org/TR/WD-entities Contoh : Penguunaan Karakter khusus Simbol mata uang Yen adalah Suhu tubuh manusia normalnya 32 C 0.50 Sama dengan &frac12 sama dengan 22/7 atau sama dengan 3.14


19


Gambar II.8. Hasil Eksekusi HTML pada Browser untuk Penggunaan Karakter Khusus

II.2.5 Menambahkan Gambar Dalam HTML akan makin menarik apabila ditambahkan gambar-gambar ke dalamnya. Format gambar yang dapat ditampilkan ada beberapa jenis, yaitu: GIF, JPEG, PCX, PNG, WMF, namun alangkah baiknya jika format gambar yang digunakan merupakan format yang sering dikenal hampir semua browser, yaitu GIF dan JPEG. Untuk menambahkan gambar ke dalam dokumen HTML digunakan tag . Tag mempunyai beberapa atribut sebagai berikut : Attribut SRC ALIGN WIDTH HEIGHT ALT Keterangan Merujuk pada URL atau direktori file gambar Menentukan posisi teks disekitar gambar, nilainya adalah TOP, MIDDLE, BOTTOM, LEFT atau RIGHT Menentukan lebar dari gambar pixel Menentukan tinggi dari gambar dalam pixel Menampilkan teks pengganti gambar jika gambar tidak dapat ditampilkan. (Pada browser tertentu dapat pula ditampilkan sebagai tool tip.)

Contoh :

Menambahkan Gambar Teks ini akan terletak pada bagian tengah tinggi gambar. Teks ini akan terletak pada bagian bawah tinggi gambar. Gambar ini akan terletak disebelah kanan teks. 20 Pemrograman Web dengan Active Server Pages (ASP)


Gambar II.9. Hasil Eksekusi HTML pada Browser untuk menampilkan gambar

II.2.6 Membuat Link Link merupakan suatu gambar atau teks yang terkait dengan suatu alamat tertentu. Jika link diklik, maka dokumen HTML akan menuju ke alamat tertentu. LINK berhubungan erat dengan apa yang disebut Anchor. Anchor merupakan sesuatu yang dapat digunakan untuk menandai sebuah dokumen HTML dan bagian yang ditandai tersebut dapat digunakan sebagai link atau alamat tujuan dari link. Sebuah anchor ditandai dengan tag . Tag mempunyai dua atribut, yaitu HREF dan NAME. Atribut HREF digunakan jika sebuah anchor akan digunakan sebagai link, sedangkan atribut NAME digunakan jika anchor akan digunakan sebagai tujuan. Contoh: Menggunakan Link Klik di sini untuk menuju www.yahoo.com.
Atau dapat juga mengklik gambar ini:

Jika ini yang diklik akan menuju ke bagian tengah dokumen.

ini adalah bagian tengah dokumen.


21


II.2.7 Membuat Tabel Untuk menampilkan dokumen data atau yang bersumber dari database, HTML menyediakan format tampilan berupa tabel. Format tabel dapat digunakan dengan menggunakan tag ,,,. Untuk mendefinisikan sebuah tabel Untuk mendefinisikan baris tabel Untuk mendefinisikan judul pada masing-masing kolom Untuk mendefinisikan isi tiap kolom

Membuat Tabel Kolom 1 Kolom 2 Kolom 3 Baris 1, Kolom 1 baris 1, Kolom 2 baris 1, Kolom 3 Baris 2, Kolom 1 baris 2, kolom 2 baris 2, Kolom 3


22


Gambar II.10. Hasil eksekusi HTML pada Browser untuk Penggunaan Tabel

Untuk membuat tampilan tabel tampak lebih menarik, maka tag dan memiliki beberapa atribut yang dapat digunakan untuk pemformatan. TAG ATRIBUT ALIGN BACKGROUND BDCOLOR BORDER BORDER COLOR BORDER COLOR LIGHT BORDER COLOR DARK CELLSPACING CELLPADING HEIGHT WIDTH VALIGN ALIGN BACKGROUND BGCOLOR BORDER BORDER COLOR BORDER COLOR LIGHT BORDER COLOR DARK COLSPAN HEIGHT NOWRAP ROWSPAN VALIGN KETERANGAN Align tabel Gambar latar belakang Warna latar belakang Tabel bingkai Warna bingkai Warna muka table Warna bayangan table Spasi antar sel Jarak isi sel dengan bingkai Tinggi table Lebar table Align vertikal teks dalam table Align horizontal teks dalam sel Gambar latar belakang sel Warna latar belakang sel Lebar bingkai sel Warna bingkai sel Warna depan bingkai sel Warna belakang bingkai sel Jumlah kolom yang digabung Tinggi sel Menahan teks dalam satu baris Jumlah baris yang digabung Align vertikan teks dalam sel

Untuk lebih memahami penggunaan atribut-atribut tersebut, kita perhatikan contoh berikut : Table Alignments Pemrograman Web dengan Active Server Pages (ASP) 23


MEDALI EMAS MEDALI PERAK MEDALI PERUNGGU INDONESIA XX
XX X XXX MALAYSIA XXX
XXX XXX XXX
XXXXX
XXX SINGAPURA XXXXX XX
XXXXX XXXXX

II.2.8 Form Form merupakan komponen HTML yang sangat penting dalam pemrograman ASP. Karena form merupakan komponen yang digunakan untuk mengambil input dari user untuk diolah lebih lanjut dalam program. Contoh penggunaan form pada umumnya adalah untuk membuat form buku tamu, formulir pendaftaran, dll. Dalam form buku tamu atau formulir pendaftaran user dapat memasukkan data-data yang dibutuhkan untuk dimasukkan dalam database situs. Untuk membuat form digunakan tag sebagai berikut: {[Komponen form]

Komponen form pada sintaks di atas antara lain: a. Input Box Pada komponen ini terdapat beberapa tipe input, yaitu tipe teks dan tipe password. Dengan Input Box dengan tipe teks user dapat memasukkan string dalam satu baris seperti Nama, Alamat, dll. Sedangkan tipe password untuk memasukkan teks password,Pemrograman Web dengan Active Server Pages (ASP) 24


dimana pada Input Box ini teks yang diketikkan dapat disembunyikan dengan menampakkan karakter * saja. Selain stribut tipe, Input Box juga mempunyai atribut lain antara lain. TAG ATRIBUT Type Name Value Size Maxlength KETERANGAN Type Input Box Nama Input Box Nilai yang dikandung Ukuran panjang Jumlah maksimum karakter

Gambar Nama :
Alamat :
password :

b. Radio Button Radio button adalah komponen atau control yang digunakan untuk mengambil input dari user dalam bentuk pilihan. Untuk membuat radio button dilakukan dengan merubah type input menjadi "Radio". Tambahkan script di bawah ini pada contoh di atas.
Jenis Kelamin : Pria Wanita

Pada baris ketiga contoh di atas terdapat atribut CHECKED. Atribut ini menandakan bahwa radio button untuk jenis kelamin "Pria" menjadi default pilihan. Pada komponen radio button pengguna hanya dapat memilih salah satu pilihan radio button saja dalam satu form.Pemrograman Web dengan Active Server Pages (ASP) 25


c. Check Box Jika pada radio button user hanya bisa memilih satu pilihan dari beberapa pilihan, maka pada Check Box user bisa memilih lebih dari satu pilihan. Contoh penggunaan check box pada umumnya adalah untuk memasukkan data hobi user.Hobby : Olahraga

Dapat kita lihat bahwa dalam struktur Program HTML tersebut, kita tidak melihat tag di dalamnya. Pada prinsipnya, kita tidak boleh menyatakan kedua tag tersebut secara bersamaan dalam suatu dokumen HTML. Frame Baris dan Frame Kolom mempunyai dua buah atribut, yaitu ROWS dan COLS. Atribut-atribut ini berfungsi untuk mendefinisikan bentuk dari frame tersebut, yaitu frame baris atau frame kolom. Frame baris adalah frame-frame yang membagi jendela browser ke dalam beberapa baris, sedangkan frame kolom membagi jendela browser dalam kolom-kolom. Atribut ROWS dan COLS menerima nilai numeric dalam satuan pixel, persen atau campuran dari pixel dan persen.


26


Contoh berikut ini akan menghasilkan dua buah frame baris dengan ukuran masingmasing 20% dan 60%. Pertama kita buat dua buah file htm dengan nama satu.htm dan dua.htm yang isinya seperti dibawah ini. Kemudian buat lagi file Frame.htm yang isinya juga seperti dibawah ini.Satu.htm dua.htm Frame.htm

Frame 1 Ini frame ke 1
Lihat perbedaannya

Frame 2 Ini frame ke 2 Lihat beda lebar baris

Menggunakan Frame

Gambar Eksekusi HTML pada Browser untuk Frame Set

II.11. Hasil

BAB IIILEBIH JAUH MENGENAL ASP

III.1 Pendahuluan Ke depan semua aplikasi akan mengarah ke Web Services. Oleh karena itu salah satu komponen web Services antara lain ASP. Tanpa mengerti ASP sangat sulit untukPemrograman Web dengan Active Server Pages (ASP) 27


mengetahui mengenai berbagai hal yang berhubungan dengan pembuatan Web Services tersebut. Untuk memahami ASP kita harus mengerti teknik penulisan, variabel dan struktur pemrogramannya. Setelah semua kita pahami baru kita merancang program ASP untuk Web. III.2 Struktur Program pada ASP Struktur program pada ASP tidak jauh berbeda dengan pemrograman pada umumnya, bahkan tidak terlalu jauh berbeda dengan bahasa pemrograman Visual Basic. III.3 Penulisan Script ASP Penulisan Script ASP dapat diletakkan pada halaman web dengan dua cara : Cara 1: .. script ASP ..

Cara 2:

III.4 Variabel pada ASP Pada dasarnya hanya ada satu jenis variabel dalam ASP, yaitu variant. Hanya saja untuk memudahkan dalam pengolahan, variabel pada ASP dapat dibedakan menjadi 5 yaitu : - Obyek - String - NumericPemrograman Web dengan Active Server Pages (ASP) 28


-

Date & time Boolean

Variabel obyek dibuat ketika kita ingin memprogram menggunakan obyek khusus seperti obyek Scripting, File System Object, obyek CDONTS NewMail, dan lain-lain. Variabel string adalah variabel yang berisi teks, sedangkan variabel numeric adalah variabel yang berisi bilangan, baik bilangan bulat maupun bilangan pecahan. Variabel date time berisi informasi tanggal dan waktu, sedangkan variabel berjenis boolean berisi nilai logika True atau False. III.5 Pendeklarasian Variabel Pendeklarasian variabel pada ASP bersifat opsional, yaitu boleh dilakukan boleh juga tidak. Pendeklarasian tersebut biasanya digunakan untuk mempermudah pemeliharaan variabel-variabel dalam aplikasi. Pendeklarasian variabel dapat dibuat mutlak, yaitu harus dideklarasikan dengan cara menambahkan statement di bagian atas program, sebelum menuliskan perintah-perintah ASP lainnya.

III.6 Penulisan Keterangan (Remark) Penulisan keterangan pada program dilakukan dengan terlebih dahulu menuliskan tan . III.7 Penggunaan operator & dan + Operator & digunakan untuk menyambung string, sedangkan operator + digunakan untuk menambahkan bilangan. Perhatikan perbedaannya pada contoh berikut : C=10050 D=150

III.8 Struktur Percabangan III.8.1 Percabangan dengan If - Then - Else Contoh penulisan struktur percabangan If Then Else sebagai berikut :Pemrograman Web dengan Active Server Pages (ASP) 29


18 And Pekerjaan And Status Menikah Then End If

Dapat dituliskan menjadi :If Umur > 18 And _ Pekerjaan And _ Status Menikah Then End if


33


III.11 ARRAY Array merupakan sekumpulan data yang berhubungan. Hubungan antara data ini dapat dinyatakan dengan indeks. Ada beberapa jenis array, antara lain: III.11.1 Array Satu Dimensi Berikut ini akan kita bahas array satu dimensi : Sebagai contoh, kita memiliki sejumlah nama peserta program profesional, yaitu : Purwoyanto, Muhardani, Junita, Sri Utami, Haryono. Kita dapat menyimpan kelima data ini ke dalam suatu variabel array. Variabel array ini akan memiliki lima anggota, yang diakses berdasarkan indeks, yaitu : Anggota ke-1 : Purwoyanto Anggota ke-2 : Muhardani Anggota ke-3 : Junita Anggota ke-4 : Sri Utami Anggota ke-5 : Haryono Untuk mendeklarasikan sebuah variabel array, kita harus sudah menentukan berapa jumlah anggotanya. Misalkan lima data di atas ingin kita simpan dalam variabel array nama_peserta, maka kita akan mendeklarasikannya seperti berikut : Dim nama_peserta(5) Angka lima menunjukkan jumlah anggota dari variabel array nama_peserta. Untuk mendefinisikan anggota-anggota variable ini kita menggunakan perintah : Nama_peserta(0) = Purwoyanto Nama_peserta(1) = Muhardani Nama_peserta(2) = Junita Nama_peserta(3) = Sri Utami Nama_peserta(4) = Haryono


34


Kita sudah melihat bahwa anggota-anggota variabel array akan dilaksanakan dengan menggunakan indeks berupa bilangan bulat (integer). Bilangan bulat ini selalu dimulai dari nol. Contoh : Array

III.11.2 Array Multi Dimensi Jika kita ingin membuat array dengan multi dimensi, kita harus mendeklarasikannya sebagai berikut : Dim array(n,m) Dengan n menyatakan pangjang baris dan m menyatakan panjang kolom. Sebagai contoh, bila kita ingin melengkapi data nama_peserta dengan jurusan_peserta, kita bisa menggunakan array multi dimensi sebagai berikut : Dim nama_peserta(5,2) Nama_peserta(0,0) =Purwoyanto Nama_peserta(0,1) =Manajemen Informatika Nama_peserta(1,0) =Muhardani Nama_peserta(1,1) =Akuntansi Komputer Nama_peserta(2,0) =Junita Nama_peserta(2,1) =Sekretaris & PR Nama_peserta(3,0) =Sri Utami Nama_peserta(3,1) =PerhotelanPemrograman Web dengan Active Server Pages (ASP) 35


Nama_peserta(4,0) =Haryono Nama_peserta(4,1) =Bahasa Inggris Berikut ini gambaran array multi dimensi : No. 0 1 2 3 4 0 Purwoyanto Muhardani Junita Sri Utami Haryono 1 Manajemen Informatika Akuntansi Komputer Sekretaris & PR Perhotelan Bahasa Inggris

Nama peserta III.11.3 Array Dinamis

Jurusan peserta

Jika pada array tadi kita harus menyatakan dahulu jumlah anggota array-nya, maka pada array dinamis kita tidak perlu melakukannya, kita cukup melakukan : Dim array(n) Kemudian untuk menggunakan array tersebut, kita mendefinisikan kembali jumlah anggotanya dengan perintah : Redim array(n) Contoh : Dim nama_peserta() Redim nama_peserta(5) Nama_peserta(0) =Purwoyanto Nama_peserta(1) =Muhardani Nama_peserta(2) =Junita Nama_peserta(3) =Sri Utami Nama_peserta(4) =Haryono


36


BAB IVMENGHUBUNGKAN ASP DENGAN DATABASEAgar database yang kita buat dapat digunakan di web dan agar database mudah diterapkan ASP di server Internet, bukan hanya diserver local, maka database harus di hubungkan dengan ASP. Ada 2 cara yang sering digunakan dalam menghubungkan database dengan ASP, yaitu : 1. Menghubungkan ASP dengan database; dengan catatatan harus disetting ODBC (Open Database Conectivity). 2. Menghubungkan ASP dengan database; dengan catatan tanpa setting ODBC, atau tanpa menggunakan DSN (Data source name) IV.1 Menghubungkan Database dengan ASP dengan disetting ODBC Apabila database yang akan kita gunakan akan dihubungkan dengan ASP, maka database tersebut harus disetting pada ODBC. Contoh String koneksi database dengan ASP dengan disetting ODBC:


37


Misalkan kita mempunyai database dengan nama pustaka.mdb yang dibuat dengan Microsoft Access. Salah satu tabel dari perpustakaan tersebut adalah tabel anggota dengan struktur file sbb: Field Name ID ID_ANGGOTA NAMA ALAMAT TELPON E_MAIL Data Type Autonumber Text Text Text Text Text

Maka sebelum database tersebut kita gunakan harus disetting terlebih dahulu pada ODBC. Langkah-langkah setting file database pada ODBC adalah sbb: 1. Aktifkan Control Panel, kemudian pilih Data Sources (ODBC). 2. Akan muncul tampilan seperti Gambar IV.1., lalu tekan ADD.

Gambar IV.1. Tampilan ODBC Data Source Administrator


38


3. Akan muncul dialog Create New Data Source, kemudian pilihlah database yang telah dibuat. Dalam hal ini pilih Microsoft Acces, kemudian tekan Finish.

Gambar IV.2. Tampilan ODBC setelah dipilih ADD

4. Sekarang definisikan database kita, dan perhatikan gambar berikut : 5. Isi Data Source Name dengan nama DSN yang akan dibuat, contoh Perpustakaan. 6. Pada Discription bisa dituliskan deskripsi atau keterangan tentang database.

Gambar IV.3. Tampilan ODBC untuk mengisi Data Source Name (DNS) Pemrograman Web dengan Active Server Pages (ASP) 39


7. Tekan tombol Select dan pilih database yang akan dijadikan ODBC. 8. Tekan OK untuk mengakhiri semuanya. Dengan demikian database sudah siap untuk digunakan.

Gambar IV.4. Tampilan Pemilahan Database (Select Dabase)

Sampai di sini, database kita sudah berhasil di setting dan siap untuk digunakan. Misalkan kita sudah memasukkan data anggota 5 record, maka string yang digunakan untuk menampilkan data tabel anggota adalah sbb:

IV. 2 Menghubungkan Database dengan ASP tanpa Setting ODBC Koneksi data tanpa DSN adalah alternatif lain atau teknik pemanfaatan database langsung menggunakan driver dari masing-masing provider untuk menghubungkan ASP dengan database. Kita tidak perlu lagi mengatur sistem DSN di menu ODBC pada control panel untuk menjembatani koneksi ASP dengan database, karena penggunaan ODBC akan menyulitkan pengguna yang ingin memanfaatkan web server gratis berbasis ASP. Pemanfaatan ODBC mengharuskan adanya campur tangan pemilik web server untuk memungkinkan hal tersebut. Namun kelihatannya pelayanan tersebut tidak dapat ditemukan di semua web server gratis. Contoh String koneksi database dengan ASP : Misalkan kita mempunyai database dengan nama perpustakaan.mdb. Salah satu tabel dari perpustakaan tersebut adalah tabel anggota dengan struktur file sbb: Field Name Data Type

ID Autonumber ID_ANGGOTA Text NAMA Text ALAMAT Text TELPON Text E_MAIL Text Berikut ini perintah untuk koneksi database dengan ASP dan untuk menampilkan data anggota adalah sbb:

Perintah tersebut di atas dapat langsung digunakan dengan menyebutkan nama provider dari database tersebut tanpa database disetting pada ODBC.

BAB VAPLIKASI WEB DENGAN ASP DAN DATABASEPada bab ini kita akan mencoba menerapkan konsep menghubungkan database dengan ASP tanpa setting ODBC atau istilah lain tanpa DSN melalui pembuatan aplikasi web pendaftaran siswa. Aplikasi ini akan terkoneksi ke dalam database untuk menyimpan database pendaftar yang mendaftar melalui internet setiap hari. Secara keseluruhan isi dari aplikasi web tersebut dapat ditampilkan melalui menu-menu yang telah dibuat. Untuk mempersiapkan pembuatan aplikasi ini, kita cukup membuat direktori baru di bawah direktori Inetpub\wwwroot\ dengan nama bebas, misalnya Proyek_2. Selanjutnya semua script yang kita buat akan diletakkan di dalam direktori tersebut.Pemrograman Web dengan Active Server Pages (ASP) 42


V.1 Pembuatan Database Database yang digunakan dalam aplikasi ini adalah Microsoft Acces. Dalam database tersebut kita dapat membuat tabel untuk penyimpanan data siswa. Buatlah database dengan nama daftar.mdb. Selanjutnya buatlah tabel dengan nama peserta, yang tersusun seperti struktur berikut ini : Field Nodaf Nama Tgl_lhr Tem_lhr Pendidikan Alamat1 Alamat2 Alamat3 No_tlp Hp Email Jenkel Jurusan Pwd Type Autonumber Text Date/Time Text Text Text Text Text Text Text Text Text Text Text Keterangan Nomor Urut Pendaftar Nama Pendaftar Tanggal Lahir Pendaftar Tempat Lahir Pendaftar Pendidikan Akhir Pendaftar Alamat Pendaftar Alamat Pendaftar Alamat Pendaftar Nomor Telepon Pendaftar Nomor Handphone Pendaftar Alamat Email Pendaftar Jenis Kelamin Pendaftar Jurusan yang dipilih Password Pendaftar

V.2 Perancangan Aplikasi Seperti halnya aplikasi pemrograman Personal Computer (PC), aplikasi berbasis web juga terdiri atas beberapa program yang menunjang satu sama lain. Kesemuanya akan menjadi satu dan terhubung oleh link yang berfungsi sebagai menu. Untuk melihat gambaran secara keseluruhan dari program yang akan dirancang dapat digambarkan seperti bagan berikut ini:

Struktur Program WebPendaftaran Peserta

Home.htm


Profile.htm

43

Biaya.thm


Kiri.htm

Visi.htm

Judul.htm

Kurikulum.htm

INDEX.HTM

E-mail.htm

Fasilitas.htm

Menu.htm

Alamat.htm

Program.htm

Syarat.htm

Daftar.asp

Tdaftar.asp

Program web ini terdiri 16 Program. Program ini terhubung antara satu program dengan program yang lainnya. Untuk lebih jelasnya akan dibahas satu per satu isi dari program web ini. 1. Index.htm Program ini adalah program utama dari keseluruhan dari web ini. (Lihat gambar V.1.)Pemrograman Web dengan Active Server Pages (ASP) 44


2. Kiri.htm Program ini untuk menampilkan informasi semua dari isi web yang ada di sebelah kiri dari tampilan program ini. (Lihat Gambar V.1.)

Home
Profile
Visi Misi
Kurikulum
Fasilitas
Biaya
Jurusan
Syarat
Daftar

Pemrograman Web dengan Active Server Pages (ASP) 45


3. Judul.htm Program ini untuk menampilkan judul dari program web ini. (Lihat Gambar V.1.) PROGRAM PROFESIONAL 1 TAHUN
LBPP-LIA

4. E-mail.htm Program ini untuk memberikan fasilitas untuk mengirim atau menerima e-mail. (Lihat Gambar V.1.)

Documents

58362330 Buku ASP Terbaru A