VB.NET: Menampilkan Data dalam Bentuk Tabel di RDLC Report dari Database MySQL

Di artikel ini Rani mau membahas tentang bagaimana kita menampilkan data dari database MySQL ke report RDLC dalam bentuk tabel.

Bagaimana cara kita koneksi ke MySQL sebenernya bebas2 aja terserah temen2 asalkan saat mengambil data bisa ditampung ke dalam DataTable, DataList, atau Collection. Di artikel ini Rani menggunakan DataTable. Dan untuk koneksi MySQL Rani pakau MySQL Connector Net yang untuk penggunaan dan instalasinya pernah dibahas tersendiri di artikel berikut:

http://rani-irsan.blogspot.com/2012/12/koneksi-vbnet-ke-mysql.html

Klo temen-temen udah install MySQLConnector kita bisa mulai. 

Sebagai permulaan kita sudah punya sebuah project/solution desktop aplikasi dengan bahasa VB.NET seperti di bawah. Kita akan menambahkan reference dengan cara klik kanan di node project pada solution explorer kemudian pilih Reference...


Pada reference manager kita pilih tab Browse, jika sudah pernah pakai biasanya muncul MySQLData.dll nya tapi klo belum kita klik tombol Browse... di bawah. Dan disini Rani baru install versi yang lebih baru jadi Rani klik Browse juga.

Kita browse ke tampat MySQL Connector terinstall, sebagai contoh yang Rani gunakan ada di:

C:\Program Files (x86)\MySQL\MySQL Connector Net 8.0.27\Assemblies\v4.5.2


Contoh di atas Rani pakai versi 8.0.27 dan Assemblies itu tergantung pada .NET Framework yang kita pakai. Karena di project ini Rani pakai Framework 4.5.2 jadi pilih yang Assemblies\v4.5.2. Centang untuk memilih kemudian klik tombol OK.


Setelah itu kita tambahkan sebuah item baru yaitu DataSet yang berfungsi untuk mendefinisikan struktur data. Klik kanan di Project Node --> New Item...




Pilih Data, DataSet, kita boleh beri nama tapi kali ini Rani biarkan default saja. Lalu klik tombol Add.


 
DataSet sudah ditambahkan. Double klik untuk membuka desain dataset.


Klik kanan di area design DataSet1 -> Add -> DataTable


Di contoh ini kita akan menampilkan data dari tabel bernama class. Jadi kita beri nama class saja DataTable nya.


Tambahkan 2 buah kolom dengan klik kanan di bawah nama DataTable tadi -> Add -> Column.


Beri nama kolom sesuai dengan kolom yang ada di tabel class yaitu classcode dan classname.



Selesai dengan DataSet, jangan lupa Save All. Sekarang kita akan menambahkan sebuah file rdlc Report dengan klik kanan di node project -> Add --> New Item


Di common item cari Report, kalian boleh kasih nama yang sesuai tapi di sini Rani biarkan Report1.rdlc sajah dan klik tombol add.


Design Report.rdlc akan seperti berikut:


Tahap selanjutnya kita akan menambahkan Dataset untuk report. Pada Report Data, klik kanan di folder DataSet kemudian pilih Add Dataset...

Jika panel Report Data belum muncul, pastikan dulu design Report1.rdlc tampil (terpilih) di layar kita. Kemudian klik View --> Report Data.


Saat muncul Dataset Properties, beri nama yang sesuai terlebih dahulu, kemudian pilih Datasource dari dropdownlist nya.Karena  DataSet1 sudah masuk dalam project/solution kita maka dia akan muncul di list.


Setelah datasource terpilih maka tabel-table yang ada disitu akan muncul di list Available datasets.
Tadi kita cuman buat 1 yaitu class, jadi pilih itu pastinya. Dan di grid field akan menujukan field apa saja yang ada. Klik OK.


DataSet1 sudah muncul di bawah folder DataSet dan memuat 2 field classcode dan classname.


Kembali ke desain UI report, kita buka ToolBox dan pilih Table untuk ditampilkan ke report.


Table tersebut bernama Tablix1 (secara otomatis) dan set di property DataSetName ke DataSet1.



Dan table tersebut juga menghasilkan 3 buah kolom secara otomatis. Karena kita hanya akan menampilkan 2 buah kolom jadi kita hapus 1 kolom. Cara menghapus kolom table pada rdlc, sorot kolom yang akan dihapus -> klik kanan lalu pilih Delete Columns.


Baris pertama adalah header column, jadi kita beri judul kolom masing-masing.


Karena kita sudah set dataset-nya maka kita dapat memilih nama field untuk ditampilkan dengan klik icon kecil di sudut kanan atas masing-masing cell.



Kita tambahkan sebuah Text Box untuk menambahkan judul.



Kemudian Rani beri judul "Class of Product". Textbox ini kita bisa format jenis font, ukuran, bold, dan alignment.


Selanjutnya pada Form1 kita akan menambahkan ReportViewer yang berfungsi untuk menampilkan report pada form.

Jika report viewer belum muncul di project solution maka teman-teman bisa lihat cara menambahkannya di link berikut:

Rapikan report viewer agar mengisi seluruh area form, kemudian set properti Anchor di semua sisi (Top, Bottom, Left, Right) agar saat form resize (berubah ukuran) report viewer akan tetap memenuhi area form.


Seperti yang Rani bilang di awal, untuk koneksi database Rani menggunakan MySQL Connector. Dan jika teman-temen menggunakan MySQL Connector juga, teman-teman bisa menggunakan module database yang sudah Rani buat dan bisa di download di sini:


Update: Untuk temen2 yang masih pakai versi sebelum VS2015 bisa download yang ini:


Setelah selesai download, copy file modDatabase.vb ke project yang sedang kita kerjakan.


Kemudian kembali ke Visual Studio di bagian Solution Explorer, aktifkan Show All Files, maka modDatabase.vb akan muncul tetapi samar-samar. Klik kanan di atas modDatabase.vb kemudian pilih Include In Project, sehingga file module tersebut menjadi bagian dari project yang tidak tampil samar lagi.



Bagian yang perlu di sesuaikan adalah setting koneksi berikut:



Code berikut adalah code untuk Form1.vb:

Imports Microsoft.Reporting.WinForms

Public Class Form1

 Private Sub Form1_Load(sender As Object, e As EventArgs) Handles MyBase.Load

   GetDatabaseSetting()
   Me.ReportViewer1.LocalReport.ReportPath = "Report1.rdlc"

   Dim dtClass As DataTable = _
               GetDataTable("SELECT classcode, classname FROM class")

   Dim dataSource As ReportDataSource = _
               New ReportDataSource("DataSet1", dtClass)
   ReportViewer1.LocalReport.DataSources.Clear()
   ReportViewer1.LocalReport.DataSources.Add(dataSource)
   ReportViewer1.SetDisplayMode(DisplayMode.PrintLayout)
   Me.ReportViewer1.RefreshReport()

 End Sub
End Class

Kode di atas akan menampilkan Report pada Form1 pada saat event form_load. Yang perlu diperhatikan adalah code yang diberi tanda kuning adalah code ringkas untuk mendapatkan data dari MySQL dengan menggunakan modDatabase.vb tadi.

Procedure GetDatabaseSetting() cukup dipanggil 1 kali, yaitu ketika aplikasi mulai dijalankan (kecuali ada perubahan setting database). Setelah GetDatabaseSetting() dijalankan maka GetDataTable() bisa dipanggil berulang kali. 

Setelah selesai dengan code, sebelum mencoba running jangan lupa untuk setting 2 property berikut:


Kedua property tersebut adalah property yang muncul saat kita menyorot file report kita di Solution Explorer. Build Action = Content, ini untuk menyertakan file report kita saat membuat installer/package. Copy to Output Directory = Copy always atau kita juga bisa memilih Copy if newer, yang berfungsi untuk mengcopy file report ke folder debug atau release.

Lalu mari kita coba run debug. 



Preview di atas Rani set zoom ke PageWidth, agar isi tabel terlihat jelas.


Download Sample Project

Post a Comment

0 Comments