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

September 15, 2010

MODUL : V ASP .NET

[ DATABASE, CONN, INPUT, TABEL,REPORT ]

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 / 2005 2. Untuk setiap Tabel sesuaikan field name nya dan data type untuk lebih jelasnya dapat dilihan dibawah ini: Tabel : Anggota

Tabel : Buku

1

STT Indonesia | wan h manihuruk,s.kom. [http://zagal99.wordpess.com/praktek] atau [http://wan99.wordpess.com]

September 15, 2010

MODUL : V ASP .NET


Tabel : Denda

Tabel : Peminjaman

Tabel : Pengembalian

Tabel : Log

Tabel : Supplier

2


September 15, 2010

MODUL : V ASP .NET


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.

3

RANCANGAN HALAMAN UTAMA 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 :  Anggota  Supplier  Peminjaman  Pengambalian  Denda  Buku - Rancanglah form utama sesuai dengan selera anda


September 15, 2010

-

C.

MODUL : V ASP .NET


Jika sudah jalankan Run [Ctrl F5] Hasilnya akan seperti dibawah ini.

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


September 15, 2010

c.1

MODUL : V ASP .NET


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


September 15, 2010

MODUL : V ASP .NET


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


September 15, 2010

MODUL : V ASP .NET


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


September 15, 2010

MODUL : V ASP .NET


11. Jika sudah cari difolder mana anda menyimpan database perpustakaan

12. Jika sudah ditemukan Klik Open 13. Maka hasilnya seperti dibawah ini.

8


September 15, 2010

MODUL : V ASP .NET


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

16. Klik Next.

9


September 15, 2010

MODUL : V ASP .NET


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.

10

18. 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. STT Indonesia | wan h manihuruk,s.kom. [http://zagal99.wordpess.com/praktek] atau [http://wan99.wordpess.com]

September 15, 2010

MODUL : V ASP .NET


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


September 15, 2010

MODUL : V ASP .NET


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


September 15, 2010



MODUL : V ASP .NET


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


September 15, 2010 D.

MODUL : V ASP .NET


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


September 15, 2010

MODUL : V ASP .NET


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


September 15, 2010

MODUL : V ASP .NET


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

16

11. 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.


September 15, 2010

MODUL : V ASP .NET


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


September 15, 2010

MODUL : V ASP .NET


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


September 15, 2010

MODUL : V ASP .NET


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


September 15, 2010

MODUL : V ASP .NET


20


September 15, 2010

MODUL : V ASP .NET


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


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

Recommend Documents