Memprogram Database Web Interaktif

Diposting oleh M. Darmansyah Putra Jumat, 03 Desember 2010

1. Pembuatan Database

Langkah-langkah pembuatan database sebagai berikut;
1. Aktifkan Microsoft Access. Buat database datasiswa dan simpan dalam C:\SMUKU-INT\database yang sudah kamu buat sebelumnya.
2. Buat satu tabel dengan nama DataSiswa dengan struktur isi tabel seperti didefinisikan pada tabel saat kamu melakukan persiapan skenario user interface

2. Pembuatan Data Source Name (DSN)
DSN ini akan mempermudah pengaksesan data dari progam ke database. Langkah-langkah membuat DSN sebagai berikut ;
1. Tekan tombol start > Control Panel > Performance and Maintenance > Administrative Tools > Data Sources (ODBC)
2. Pilih tab System DSN. Klik tombol Add > pilih Microsoft Access Driver (8.mdb) lalu Finish.
3. Pada kotak dialog ODBC Microsoft Access Setup, isi kotak Data Source Name dengan DataSiswa dan kotak Description dengan data siswa. Tekan tombol Select untuk memasukkan database dengan lokasi C:\SMUKU-INT\database\datasiswa.mdb. lalu OK

3. Pemrograman
Untuk pemrograman ini akan ditampilkan halaman HTML dan halaman modifikasi menjadi ASP. Dari kedua halaman tersebut, dapat dibandingkan perubahan yang diperlukan untuk membuat halaman homepage yang interkatif
1. Programming halaman pertama yaitu pembuatan halaman datasiswa.htm yang telah kamu lakukan sebelumnya. Buka kembali halaman datasiswa.htm pada Microsoft FrontPage.
2. Lakukan modifikasi terhadap halaman datasiswa.htm dengan memasukkan kode ASP dibawah ini pada bagian awal halaman sebelum tag <html>


Aturan tersebut jika digabung akan menjadi
<%@ Languange=VBScript %>
<%
dim comm
dim rs dim NomorInduk
dim Nama
dim TanggalLahir
dim Kelas
dim Jurusan
dim TahunMasuk
dim strSQL

if request.Form ("cmdSimpan")="Simpan" then
      NomorInduk=Request.Form("txtNomorInduk")
      Nama=Request.Form("txtnama")
      TanggalLahir=Request.Form("txtTanggalLahir")
      Kelas=Request.Form("cboKelas")
      Jurusan=Request.Form("cboJurusan")
     TahunMasuk=Request.Form("cboTahunMasuk")

  strSQL="Insert into DataSiswa(NomorInduk,Nama,TanggalLahir,Kelas,Jurusan,TahunMasuk) values ('" &_NomorInduk & " ',' " & Nama & " ',' " & TanggalLahir & " ',' " & Jurusan & " ',' " & _ TahunMasuk & "')"
                   Set conn = Server.CreateObject ("ADODB.Connection")
                   Set rs = Server.CreateObject ("ADODB.Recordset")
                   conn.Open "DSN=DataSiswa"
                   rs.open strsql, conn, 2, 2

                  Set rs = Nothing
                  Set conn = Nothing

end if
%>

3. Ganti action=”--WEBBOT-SELF--“ yang terdapat dalam tag form datasiswa.asp dengan action=”datasiswa.asp”.
4. Ubahlah baris kode <input type="button" value="Lihat" name="cmdLihat"> menjadi <input type="button" value="Lihat" name="cmdLihat" onclick="javascript:window.open('lihatdatasiswa.asp');"/>. Simpan file dengan nama datasiswa.asp.
5. Programming halaman kedua yaitu pembuatan halaman lihatdatasiswa.htm yang telah kamu lakukan sebelumnya.
6. Akan dilakukan modifikasi terhadap halaman lihatdatasiswa.htm dengan memasukkan kode ASP di bawah ini pada bagian awal halaman sebelum tag <html>

Aturan tersebut jika digabung akan menjadi
<%@ Languange=VBScript %>
<%
dim conn
dim rs
dim strSQL
dim ccount

strSQL="SELECT count(*) as Ccount FROM DataSiswa"
Set conn = Server.CreateObject ("ADODB.Connection")
Set rs = Server.CreateObject ("ADODB.Recordset")
conn.Open "DSN=DataSiswa"
rs.open strsql, conn, 2, 2
ccount=rs ("Ccount")
rs.close
strSQL="SELECT * FROM DataSiswa"
rs.open strSQL, 2, 2

%>

7. Ubahlah kode di antara tag <table></table> menjadi kode dibawah ini

Aturan tersebut jika digabung akan menjadi
<table border="1" width "100%">
<tr>
<td width="14%">No</td>
<td width="14%">Nomor Induk</td>
<td width="14%">Nama</td>
<td width="14%">Tanggal Lahir</td>
<td width="14%">Kelas</td>
<td width="15%">Jurusan</td>
<td width="15%">Tahun Masuk</td>
</tr>

<%
if not rs.EOF or not rs.BOF then
for i=1 to ccount
%>

<tr>
<td width="14%"><%=i%>&nbsp;</td>
<td width="14%"><%=rs ("NomorInduk") %>%nbsp;</td>
<td width="14%"><%=rs ("Nama") %>%nbsp;</td>
<td width="14%"><%=rs ("TanggalLahir") %>%nbsp;</td>
<td width="14%"><%=rs ("Kelas") %>%nbsp;</td>
<td width="14%"><%=rs ("Jurusan") %>%nbsp;</td>
<td width="14%"><%=rs ("TahunMasuk") %>%nbsp;</td>
</tr>
<%
Next
End If
rs.close
conn.Close
Set rs = Nothing
Set conn = Nothing
%>
</table>

8. Ganti <input type="button" value="Kembali" name="cmdKembali" /> dengan <input type="button" value="Kembali" name="cmdKembali" onclick="javascript:window.close();" /> utnuk menutup jendela baru yang dibuka dengan cara menekan tombol Lihat pada halaman datasiswa.asp.
9. Simpan file dengan nama lihatdatasiswa.asp.

4. Pengujian (Testing)
Testing ini adalah memberitahukan kepada kita apabila terdapat kesalahan dalam coding yang kita lakukan. Keslaahan tersebut akan langsung ditampilkan dalam browser yang kita akses. Jika tidak terdapat kesalahan maka kita dapat mengetahui bahwa data tersebut sudah tersimpan dalam database bukan dalam halaman lihatdatasiswa.asp

Related Post:

0 Responses to Memprogram Database Web Interaktif

Posting Komentar

Daftar Isi