MODUL : V [ DATABASE, CONN, INPUT, TABEL,REPORT ] ASP.NET

Ukuran: px

Mulai penontonan dengan halaman:

Download "MODUL : V [ DATABASE, CONN, INPUT, TABEL,REPORT ] ASP.NET"

Suharto Lesmono
7 tahun lalu
Tontonan:

1 STUDI KASUS PERPUSTAKAAN - Diharapkan dengan modul ini mahasiswa dapat membuat database semaksimal mungkin dengan menggunakan database Access atau Sql Server. - Mahasiswa juga dapat mengenal berbagai connection yang disediakan oleh Asp.net - Diharapkan mahasiswa dapat membuat inputan dan tabel yang terhubung antara relasi tabel yang akan di olah. - Studi kasus ini akan menghasilkan report yang diinginkan oleh user, diharapkan juga mahasiswa dapat menguasai aplikasi report yang digunakan contohnya seperti [Cristal Report 8.5,X,XI,XII]. Lets Goo. A. RANCANGAN TABEL PERPUSTAKAAN 1. Buat Tabel Perpustakaan seperti dibawah ini dengan database Access / SQL Server 2000 / Untuk setiap Tabel sesuaikan field name nya dan data type untuk lebih jelasnya dapat dilihan dibawah ini: Tabel : Anggota Tabel : Buku 1

2 Tabel : Denda Tabel : Peminjaman Tabel : Pengembalian Tabel : Log Tabel : Supplier 2

3 Ket u/ database: Jika sudah selesai membuat database Perhatikan Field Name dan Data Type jika tipe data anda tidak sesuai dengan yang akan diinputkan pada aplikasi asp.net, maka aplikasi yang akan anda buat akan bermasalah [ tidak akan terhubung ] Sebelum melanjutkan perhatikan hubungan relasi tabel dibawah ini apakah sudah sesuai atau belum, cek kembali primerikey pada tabel anda. Gambar A: Hubungan Relasi Antara Tabel Perpustakaan B. RANCANGAN HALAMAN UTAMA 3 1. Rancanglah desain Halaman Utama pada Asp.net seperti dibawah ini: - Untuk membuat master page lihat kembali [modul praktek2a asp] - Untuk o Anggota o Supplier o Peminjaman o Pengembalian o Denda o Buku Jika di klik akan link ke form, masukan sintak dibawah ini : <a href="anggota.aspx">anggota</a> <a href="supplier.aspx">supplier</a> <a href="peminjaman.aspx">peminjaman</a> <a href="pengambalian.aspx">pengambalian</a> <a href="denda.aspx">denda</a> <a href="buku.aspx">buku</a> - Rancanglah form utama sesuai dengan selera anda

4 - Jika sudah jalankan Run [Ctrl F5] - Hasilnya akan seperti dibawah ini. C. RANCANGAN FORM ANGGOTA Untuk Form Anggota seperti dibawah ini : Rancanglah desain Halaman Anggota pada Asp.net seperti dibawah ini: - Untuk membuat master page lihat kembali [modul praktek2a asp] 4

5 c.1 CONNECTION Untuk conn ikuti langkah-langkah dibawah ini : 1. Pada menubar Asp.net sorot table insert tabel kemudian atur size seperti dibawah ini: 2. Pada toolbox sorot data SqlDataSource double klik 5

6 3. Maka akan muncul pada conten [halaman kerja asp.net] seperti dibawah ini 4. Klik panah samping kanan atas akan muncul Sqldatasource task 5. Kemudian klik confiqure data source makan akan muncul confiqure data source seperti dibawah ini. 6. Klik new connection agar tampil Add Connection 6

7 7. Kemudian klik change pada add connection maka anda akan dihadapkan pada change data source dibawah ini. 8. Kali ini akan kita coba dengan data source Microsoft access data file 9. Jika sudah klik OK 10. Kemudian klik browse 7

8 11. Jika sudah cari difolder mana anda menyimpan database perpustakaan 12. Jika sudah ditemukan Klik Open 13. Maka hasilnya seperti dibawah ini. 8

9 14. Klik test Connection jika success klik Ok 15. Maka anda akan dihadapkan dengan tampilan seperti dibawah ini. 16. Klik Next. 9

10 17. Klik lagi Next maka akan tampil seperti dibawah ini. a. Pilih name anggota pada database b. Cekklis * pada columns c. Jika sudah klik button advanced d. Maka akan tampil advanced SQL Generation Option dibawah ini (sebelah kanan) e. Kemudian cekklis Generate INSERT, UPDATE, dan DELETE statements f. Kemudian klik OK Klik Next makan akan tampil seperti dibawah ini. a. Klik Test Query jika tampil seperti dibawah ini anda berhasil terkoneksi dengan database. b. Kemudian klik Finish.

11 Koneksi yang anda lakukan berhasil Untuk koneksi data source SQL Server dan ODBC kurang lebih sama kecuali ODBC sedikit berbeda karena anda harus mengaktifkan connection ODBC pada SO [system operasi] windows c.2 Input Anggota dan tabel anggota Gunakan form baru Input Untuk inputan sangat banyak cara secara manual ataupun otomatis untuk mempersingkat waktu kita akan gunakan cara praktis [otomatis] dengan siarat koneksi anda sudah BERHASIL 1. Pada toolbox Asp.net anda sorot Data kemudian ada tiga yang bisa kita gunakan untuk inputan otomatis Datalist, DetailsView, FormView 2. Kali ini kita akan menggunakan DetailsView 3. Double Klik atau drack DetailsView pada konten [halaman kerja] asp.net. 4. Untuk lebih jelas lihat gambar dibawah ini. 11

12 5. Jika sudah maka akan tampil pada halaman kerja Asp.Net anda seperti dibawah ini. a. Klik panah yang ada disebelah kanan atas b. Choose data source sql datasource1 c. Cekklis paging dan inserting 5. Maka hasilnya seperti dibawah ini. 7. Jika di RUN maka tampilannya seperti dibawah ini setelah di klik Insert 12

13 Tabel Tabel adalah tempat menampilkan, mengurutkan data yang di inputan contoh tampilannya tabel seperti dibawah ini: 1. Untuk membuat tabel pada Asp.Net sama dengan membuat inputan 2. Ikuti langkah langkah seperti diatas dalam membuat inputan. 3. Untuk tabel gunakan Gridview 13

14 D. RANCANGAN FORM REPORT ANGGOTA Report adalah tampilan output hasil dari manipulasi data dengan report kita dapat mencetak berbagai tampilan output sesuai dengan kebutuhan, untuk membuat report ini kita akan menggunakan fasilitas yang sudah di sediakan oleh Asp.Net. Ikuti langkah-langkah dibawah ini: 1. Pada tampilan Toolbox Asp.Net menyediakan tampilan Report 2. Sorot Toolbox Reporting CrystalReportViewer 3. CrystalReportViewer Double klik / drak pada lembar kerja. 4. Maka akan tampil seperti dibawah ini. a. Klik panah samping kanan atas. b. Pilih New Report Source c. Maka akan tampil seperti dibawah ini. 14

15 5. Buat sesuai dengan tampilan dibawah ini [reportanggota] 6. Klik OK. 7. Maka akan tampil Crystal Report Gallery a. Pilih option As a blank report. b. Kemudian klik OK. 15

16 8. Maka akan tampil seperti dibawah ini. a. Klik kanan database fields sebelah kiri atas. 9. Klik database expert 10. Maka akan tampil seperti dibawah ini. a. Sorot Create new Connection OLE DB (ADO) pada make new connection double klik Setelah double klik akan tampil a. Pilih sesuai dengan kebutuhan anda b. Untuk kasus kali ini anda pilih Provider : Microsoft Jet 4.0 OLE DB Provider. c. Klik Next.

17 12. Maka akan tampil OLE DB (ADO) seperti dibawah ini. a. Pada database name brows [cari dimana anda membuat database] untuk lebih jelas lihat gambar dibawah ini. 13. Klik Next 17

18 14. Kemudian finish. 15. Setelah tampil semua tabel yang akan digunakan blok a. Kemudian klik tanda panah b. OK. 16. Maka tampilan link akan tampil 18

19 17. Klik OK 18. Pada field Explorer akan tampil seperti dibawah ini a. Pilih tabel anggota semua field anggota yang dibutuhkan drack pada report setu persatu pada section 3 [details] b. Kemudian Save. 19

20 20

21 19. Setelah diruning tampilannya seperti di bawah ini. Keterangan : - Selamat mencoba - Jika sudah selesai, rancang form dibawah ini : o Supplier o Peminjaman o Pengembalian o Denda o Buku 21

dokumen-dokumen yang mirip

Visual Programming 2. P-14,15 Fery Updi,M.Kom

Visual Programming 2. P-14,15 Fery Updi,M.Kom Visual Programming 2 P-14,15 Fery Updi,M.Kom 1 Mahasiswa mampu: Melakukan configurasi Visual Studio.NET, Membuat Custom Classes, Melakukan koneksi ke Database, Membuat aplikasi Form Entry sederhana, Kompetensi