Menggunakan
Database SQL Server
Bab ini akan secara langsung mengajak Anda
menggunakan database SQL Server. Ada 11 tutorial yang mengajarkan Anda untuk
langsung mempraktekkan penggunaan database SQL Server.
4.1 Dasar Database dan Menggunakan Kontrol
DataGridView
Tutorial 4.1: Menampilkan Tabel Database Pada Sebuah
Kontrol DataGridView
Pada tutorial ini, Anda akan menampilkan
baris-baris dan kolom-kolom dari sebuah tabel dengan nama StafPenjualan, yang ditempatkan pada sebuah database Perusahaan. Anda akan melihat bagaimana
mudahnya form Anda mengurutkan kolom, menghapus baris, dan menyisipkan baris
baru. Tabel StafPenjualan memuat
informasi yang terkumpul dari pekerja penjualan perusahaan. Perancangan tabel
ditampilkan pada Tabel 4.1, dan contoh-contoh baris ditampilkan pada Tabel 4.2.
Tabel 4.1 Perancangan tabel StafPenjualan
Nama Kolom
|
Tipe
|
ID
Nama_Belakang
Nama_Depan
Penuh_Waktu
Tanggal_Kerja
Gaji
|
int
(primary key)
varchar(40)
varchar(40)
bit
smalldatetime
decimal
|
Tabel 4.2 Baris-baris contoh di dalam tabel StafPenjualan
Sebelum Anda memulai tutorial ini, Anda perlu
menemukan file Perusahaan.mdf, yang
berada di dalam folder Contoh Database.
Langkah 1: Ciptakanlah sebuah aplikasi Windows Forms Application dengan nama Contoh Database.
Langkah 2: Tetapkan properti Text dari Form1 menjadi Contoh Database.
Langkah 3: Geret kontrol DataGridView dari jendela Toolbox
ke dalam form. Klik smart tag di pojok kanan-atas dari grid. Anda akan melihat
sebuah jendela kecil dengan nama DataGridView
Tasks, seperti ditunjukkan pada Gambar
4.1.
Gambar 4.1 Jendela DataGridView
Tasks
Langkah 4: Klik tanda-panah dropdown di dekat Choose Data Source. Pada dialog yang
ditampilkan (Gambar 4.2), klik pada Add
Project Data Source.
Gambar 4.2 Memilih sumber data pada Tutorial 4.1
Langkah 5: Ketika Data
Source Configuration Wizard ditampilkan (lihat Gambar 4.3a), pilih ikon Database dan klik tombol Next.
Gambar 4.3a Jendela dialog Data
Source Configuration Wizard
Langkah 6: Langkah Choose a Database Model akan ditampilkan selanjutnya. Pilih seleksi
default (Dataset) dan klik tombol Next, seperti ditampilkan pada Gambar
4.3b berikut:
Gambar 4.3b Jendela dialog Choose
a Database Model
Langkah 7: Wizard ini akan menanyakan Anda untuk
memilih koneksi data. Jika Anda telah memiliki koneksi data sebelumnya, Anda
bisa memilihnya dari dropdown list. Jika ini adalah koneksi data pertama Anda,
klik pada tombol New Connection.
Lihat Gambar 4.4.
Gambar 4.4 Memilih koneksi data
Langkah 8: Pada jendela Add Connection, jika entri Data
source tidak mengatakan Microsoft SQL Server Database File,
klik tombol Change dan pilih opsi
itu.
Gambar 4.5 Jendela Add Connection
Langkah 9: Klik tombol Browse dan cari database Perusahaan.mdf
pada folder projek. Gambar 4.10 menunjukkan path ke Perusahaan.mdf.
Langkah 10: Klik tombol Test Connection. Pastikan bahwa pesan Test Connection succeded ditampilkan, klik tombol OK dua kali untuk
kembali ke wizard, dan klik tombol Next.
Langkah 11: Anda akan melihat pesan yang ditunjukkan
pada Gambar 4.6, yang menanyakan apakah Anda ingin menyalin file database ke
direktori projek. Dengan menjawab ya, Anda dapat dengan mudah memindahkan
program Anda dan databasenya ke komputer lain. Klik tombol Yes untuk melanjutkan.
Gambar 4.6 Opsi untuk menyalin file database ke projek Anda
Langkah 12: Sekarang Anda diberikan opsi menyimpan
string koneksi pada file konfigurasi aplikasi (Lihat Gambar 4.7). Klik tombol Next untuk melanjutkan.
Gambar 4.7 Menyimpan string koneksi pada file konfigurasi aplikasi
Langkah 13: Selanjutnya, Anda diminta untuk memilih
objek-objek database yang Anda inginkan pada DataSet. Ekspansi entri di bawah Tables, tempatkan centang di samping StafPenjualan, dan ubah nama DataSet
menjadi StafPenjualanDataSet (Lihat
Gambar 4.8). Klik tombol Finish
untuk menyelesaikan wizard.
Gambar 4.8 Memilih objek-objek database
Langkah 14: Anda akan melihat kepala-kepala kolom pada
kontrol DataGridView (Lihat Gambar 4.9) yang sesuai denagn kolom-kolom StafPenjualan: ID, Nama_Belakang, Nama_Depan, Penuh_Waktu, Tanggal_Kerja,
dan Gaji. Jika jendela DataGridView Tasks masih terlihat, klik di mana saja di luar jendela untuk
menutupnya.
Gambar 4.9 Kepala-kepala kolom pada kontrol DataGridView
Langkah 15: Selanjutnya, Anda akan menyejajarkan kolom Tanggal_Kerja ke tengah. Pilih properti
Columns dan buka jendela Edit Columns, yang ditampilkan pada Gambar 4.10. Pilih kolom Tanggal_Kerja, dan pilih DefaultCellStyle. Ini akan menampilkan
jendela CellStyle Builder, yang ditampilkan pada Gambar
4.11. Pilih properti Alignment, dan
pilih MiddleCenter dari list
dropdown. Klik tombol OK sampai
jendela Edit Columns ditutup.
Gambar 4.10 Jendela dialog Edit
Columns
Langkah 16: Buka jendela Code dari form, dan periksa kode Visual Studio yang disisipkan ke
dalam event handler Load. Ia memanggil metode Fill dari StafPenjualanTableAdapter,
melewatkan kepadanya DataTable StafPenjualan di dalam StafPenjualanDataSet:
Me.StafPenjualanTableAdapter.Fill(Me.StafPenjualanDataSet.StafPenjualan)
Inilah bagaimana grid membaca datanya: TableAdapter membaca data dari
database, menggunakan metode Fill.
Metode Fill memuat sebuah query SQL
yang menentukan kolom-kolom mana dari tabel yang akan digunakan. DataTable StafPenjualan adalah sebuah kontainer yang memuat data ketika ia
ditampilkan pada kontrol DataGridView.
Gambar 4.11 Jendela CellStyle
Builder
Langkah 17: Simpan dan jalankan aplikasi. Anda akan
melihat semua baris dari tabel StafPenjualan,
seperti ditunjukkan pada Gambar 4.12.
Gambar 4.12 Menjalankan aplikasi, dan menampilka tabel StafPenjualan
Langkah 18: Sekarang baris-baris dicantumkan dengan
tatanan menaik berdasarkan nomor ID. Klik pada kolom Nama_Belakang dan amati bahwa grid sekarang diurutkan dengan
tatanan menaik berdasarkan nama belakang. Klik pada kolom Nama_Belakang kembali dan amati bahwa grid sekarang diurutkan
dengan tatanan menurun.
Langkah 19: Tempatkan mouse ke atas batas antar dua
kolom. Ketika kursor mouse berubah menjadi sebuah anak-panah horisontal,
gunakan mouse untuk menggeret batas tersebut ke kanan atau ke kiri.
Langkah 20: Coba hapus sebuah baris. Klik tombol di
kiri dari salah satu baris. Keseluruhan baris akan diseleksi (disorot). Tekan
kunci Del dan amati bahwa baris
tersebut akan menghilang. Baris tersebut telah dihapus dari memori, tetapi
bukan dari database.
Langkah 21: Selanjutnya, Anda akan menyisipkan sebuah
baris. Gulung ke baris bawah dari grid dan masukkan informasi berikut pada
sel-sel kosong: 847, Jekson, Sitogol,
(centang Waktu_Penuh), 6/1/2011, 5500000. Tekan kunci Enter untuk
menyimpannya.
Langkah 22: Urutkan grid pada kolom Nama_Belakang, dan lihat baris yang
Anda sisipkan.
Langkah 23: Tutup aplikasi dan jalankan kembali untuk
memverifikasi bahwa perubahan yang telah Anda lakukan pada DataSet tidak disimpan ke dalam database. Baris-baris gird tampak
sama seperti sebelumnya. Hentikan program kembali.
Langkah 24: Pada mode design, perhatikan tiga komponen
yang ditempatkan pada component tray di bawah form oleh Visual Studio ketika
Anda menambahkan koneksi ke tabel StafPenjualan:
- StafPenjualanDataSet adalah objek yang memuat salinan dari tabel database di memori.
- StafPenjualanBindingSource adalah objek yang memindahkan data dari dataset ke kontrol DataGridView.
- StafPenjualanTableAdapter adalah objek yang menyalin data dari database ke dalam dataset.
4.2 Memilih Baris-Baris DataSet
Pada bagian sebelumnya, Anda telah belajar
bagaimana menampilkan semua baris dari sebuah DataSet menggunakan kontrol DataGridView.
Aplikasi-aplikasi seringkali perlu menyeleksi (atau memilter) baris-baris
tertentu untuk ditampilkan. Dimisalkan bahwa Anda ingin menampilkan hanya
anggota-anggota staf penjualan yang bekerja penuh-waktu. Atau, Anda ingin
menampilkan pekerja-pekerja yang dikerjakan sebelum 2012. Anda bisa juga ingin
menampilkan pekerja-pekerja yang dikerjakan dalam lima tahun terakhir dengan
gaji kurang dari 4000000. Dengan menggunakan query SQL dan perangkat-perangkat
pada Visual Studio, hampir semua jenis pemilteran dapat dilakukan.
SQL
SQL (Structurer
Query Language) merupakan bahasa standar untuk bekerja dengan database. SQL
memuat sejumlah katakunci. Anda dapat menggunakannya untuk mengkonstruksi
statemen-statemen yang dikenal sebagai query. Query adalah instruksi yang
diberikan kepada database, yang kemudian database itu mengeksekusi query
tersebut.
Memodifikasi Query Pada Sumber Data
Untuk memodifikasi (mengedit) sebuah query
yang digunakan pada sumber data tertentu, Anda bisa melihat file skema DataSet pada jendela Solution Explorer. Dimisalkan bahwa Anda telah menciptakan sebuah sumber
data dengan nama StafPenjualanDataSet;
kemudian file skema itu diberikan nama StafPenjualanDataSet.xsd.
Anda kemudian mengklik ganda nama file tersebut untuk membuka perangkat Dataset Designer, seperti ditunjukkan pada Gambar 4.13. Baris atas
menunjukkan nama tabel (StafPenjualan).
Baris-baris berikutnya mencantumkan kolom-kolom pada tabel, yang
mengidentifikasi kolom ID sebagai primary
key. StafPenjualanTableAdapter
ditampilkan di bawahnya, diikuti dengan beberapa query database. Secara
default, ada satu query dengan nama Fill,
GetData() yang mengisi DataSet
ketika form dimuat.
Gambar 4.13 StafPenjualanDataSet, pada jendela DataSet Designer
Jika Anda mengklik-kanan pada DataSet dan memilih Configure dari menu yang dimunculkan,
Anda dapat memodifikasi query menggunakan TableAdapter
Configuration Wizard, seperti ditunjukkan pada Gambar 4.14. Jika teks query
cukup sederhana, Anda dapat memodifikasinya secara langsung pada jendela ini.
Jika query lebih kompleks, Anda bisa mengklik tombol Query Builder untuk
menampilkan jendela Query Builder, seperti ditunjukkan pada
Gambar 4.15.
Gambar 4.14 Jendela dialog TableAdapter Configuration Wizard
Query Builder
Query Builder adalah sebuah perangkat yang
disediakan oleh Visual Studio untuk menciptakan dan memodifikasi query SQL. Ia
memuat empat bagian, atau panel, seperti ditunjukkan pada Gambar 4.16:
- Panel diagram menampilkan semua tabel yang digunakan pada query, dengan sebuah tanda centang di samping setiap bidang yang akan digunakan dalam DataSet.
- Panel grid menampilkan query dengan format seperti spreadsheet, yang secara khusus cocok untuk memilih tatanan pengurutan dan memasukkan kriteria seleksi.
- Panel SQL menampilkan query SQL aktual yang berkaitan dengan tabel-tabel dan bidang-bidang yang diseleksi pada panel diagram dan panel grid. Pemrograma SQL berpengalaman akan menuliskan query-query secara langsung pada panel ini.
- Panel hasil menampilkan baris-baris yang dihasilkan dengan mengeksekusi query SQL. Untuk mengisi panel hasil, klik tombol Execute Query.
Gambar 4.15 Jendela Query
Builder
Gambar 4.16 Seleksi-seleksi pada jendela Query Builder
Untuk menambah tabel baru pada jendela Query Builder, klik kanan di dalam panel diagram dan pilih Add Table dari menu yang ditampilkan.
Menambah Query SELECT pada
DataGridView
Jika Anda ingin menambah sebuah query SELECT
pada suatu kontrol DataGridView,
cara termudah untuk melakukannya adalah dengan menggunakan TableAdapter yang dilekatkan pada grid. Dimisalkan bahwa StafPenjualanTableAdapter telah
dilekatkan pada sebuah DataGridView
yang menampilkan tabel StafPenjualan
dari database Perusahaan. Kemudian
pada mode Design, Anda dapat
mengklik kanan pada ikon TableAdapter
dan memilih Add Query. Jendela Search Criteria Builder akan ditampilkan, seperti ditunjukkan pada Gambar 4.17.
Anda dapat memodifikasi query sehingga menjadi berikut:
SELECT
ID, Nama_Belakang, Nama_Depan Penuh_Waktu, Tanggal_Kerja, Gaji
FROM
StafPenjualan
WHERE Gaji
< 4500000
Gambar 4.17 Jendela Search
Criteria Builder
Gambar 4.18 Baris-baris dataset yang difilter oleh Gaji_query
Gambar 4.18 menunjukkan jendela Search Crietria Builder setelah
penambahan klausa WHERE pada
statemen SELECT. Anda dapat
memberikan nama pada query tersebut, seperti Gaji_query. Ketika Anda mengklik tombol OK, sebuah kontrol ToolStrip akan ditambahkan pada form,
dengan sebuah tombol query. Hasilnya ditampilkan pada Gambar 4.19. Hanya
baris-baris dengan gaji kurang dari Rp. 4500000 yang ditampilkan.
Tutorial 4.2: Memfilter Baris pada Tabel StafPenjualan
Pada tutorial ini, Anda menciptakan beberapa
query yang mengubah cara baris-baris dari tabel StafPenjualan ditampilkan pada sebuah kontrol DataGridView.
Langkah-Langkah
Tutorial
Langkah 1: Salin folder Contoh Database yang
telah Anda ciptakan pada Tutorial 4.1 ke sebuah folder baru dengan nama Contoh Database 2.
Langkah 2: Buka projek dari folder Contoh Database 2.
Langkah 3: Klik kanan pada nama projek pada jendela Solution Explorer, dan pilih Rename.
Namai-ulang projek menjadi Contoh
Database 2.
Langkah 4: Pada jendela Design untuk Form1, klik
kanan pada kontrol StafPenjualanTableAdapter
pada component tray dan pilih Add Query dari menu yang dimunculkan.
Langkah 5: Pada jendela Search Criteria Builder, nama query Penuh_Waktu. Tetapkan teks query menjadi berikut:
SELECT
ID, Nama_Belakang, Nama_Depan, Penuh_Waktu, Tanggal_Kerja, Gaji
FROM StafPenjualan
WHERE
(Penuh_Waktu = ‘True’)
Langkah 6: Klik pada tombol OK untuk menutup jendela Search Criteria Builder.
Langkah 7: Jika kepala-kepala kolom grid Anda
tersembunyi di balik kontrol ToolStrip,
geser grid ke bawah untuk menampakkannya. Tetapkan properti Anchor ke empat sisi form.
Langkah 8: Simpan projek dan jalankan aplikasi. Klik
tombol Penuh_Waktu dan amati bahwa
hanya para pekerja penuh-waktu yang ditampilkan. Tutup aplikasi dan kembali ke
mode Design.
Langkah 9: Lihat kode sumber yang dihasilkan oleh
Visual Studio ketika Anda menambahkan ToolStripButton.
Ia memanggil sebuah metode dengan nama Penuh_Waktu,
menggunakan objek StafPenjualanTableAdapter.
Argumen yang dilewatkan kepada metode tersebut adalah tabel StafPenjualan yang berada di dalam StafPenjualanDataSet:
Private
Sub Penuh_WaktuToolStripButton_Click(…)
Handles Penuh_WaktuToolStripButton.Click
Try
Me.StafPenjualanTableAdapter.Penuh_Waktu
(Me.StafPenjualanDataSet.StafPenjualan)
Catch ex As System.Exception
System.Windows.Forms.MessageBox.Show(ex.Message)
End Try
End
Sub
Jika sebuah eksepsi dilemparkan, sebuah kotak
akan menampilkan pesan eksepsi. Sebagai alternatifnya, Anda dapat mengganti
pemanggilan terhadap MessageBox.Show
dengan sebuah statemen yang menugaskan suatu nilai kepada kontrol ErrorProvider.
Langkah 10: Sekarang, Anda akan menambahkan tombol lain
pada ToolStrip yang menampilkan
semua baris pada tabel. Klik kanan pada kontrol StafPenjualanTableAdapter, dan pilih Add Query.
Langkah 11: Pada jendela Search Criteria Builder, nama query dengan Semua_Baris, dan pertahankan teks query
yang ada. Klik tombol OK untuk
menutup jendela dan ciptakan query. Perhatikan bahwa kontrol ToolStrip kedua akan diciptakan pada
form, seperti ditunjukkan pada Gambar 4.20.
Gambar 4.20 Tabel StafPenjualan
pada sebuah kontrol DataGridView,
dengan dua tombol query
Langkah 12: Sekali lagi, Anda perlu membenahi atas dari
grid sehingga kepala-kepala kolom tetap terlihat.
Langkah 13: Simpan projek. Jalankan aplikasi dan klik
pada kedua tombol query.
Langkah 14: Akhiri aplikasi dan tutup projek.
Pada bagian ini, Anda akan belajar bagaiman
mengikat sumber data ke kontrol-kontrol seperti TextBox, Label, dan ListBox. Anda menamakan kontrol semacam
itu sebagai kontrol data-bound karena ia memperbarui kontennya secara otomatis
ketika Anda berpindah dari satu baris ke baris berikutnya pada sebuah DataSet. Kontrol data-bound dapat pula
memperbarui konten dari bidang-bidang. Anda akan belajar bagaimana mengikat
sebuah DataGridView pada DataSet yang telah ada. Anda juga akan
belajar bagaimana menggunakan kontrol ListBox
untuk menavigasi dari satu baris DataSet
ke baris lainnya.
Visual Studio Menyalin Fila Database
Ketika sebuah sumber data adalah sebuah file
SQL Server, jendela dialog yang ditampilkan pada Gambar 4.21 akan ditunjukkan
dan meminta Anda untuk menyalin file database ke projek Anda. Secara umum,
pembuatan salinan lokadi dari suatu database adalah hal baik.
Gambar 4.21 Penyalinan sebuah file database ke folder
projek
Jika Anda menjawab Yes pada kotak dialog tersebut, Visual Studio akan menyalin file
database ke folder akar dari projek Anda. Setiap kali Anda membangun aplikasi,
database itu secara otomatis disalin ke direktori keluaran dari projek. Ini
adalah file database yang akan ditampilkan dan diperbarui oleh aplikasi Anda.
Lokasi bergantung pada bagaimana Anda menjalankan program.
- Jika Anda menjalankan program dengan mode Debug, maka direktori keluaran adalah \bin\Debug.
- Jika Anda menjalankan tanpa debugging, maka direktori keluaran adalah \bin\Release.
Mendistribusikan Aplikasi Database
Terkompilasi
Visual Basic mempermudah Anda untuk
mendistribusikan sebuah aplikasi terkompilasi berikut dengan databasenya.
Tekniknya dinamakan dengan penyebaran xcopy. Apa yang perlu Anda lakukan adalah
menyalin file EXE dari aplikasi dan file database dari direktori \bin\Debug, atau dari folder
\bin\Release. Pada Gambar 4.22, misalnya, aplikasi dengan nama Contoh Database
dan file database Perusahaan.mdf.
Gambar 4.22 Dengan Visual Basic, Anda dapat mendistribusikan aplikasi terkompilasi dengan
databasenya
Memodifikasi String Koneksi Database
Untuk memodifikasi string koneksi database,
klik kanan pada entri dengan nama My
Project pada jendela Solution Explorer. Kemudian klik Open. Pada jendela yang ditampilkan,
pilih tab Settings. Baris pertama
pada grid adalah string koneksi database. Klik tombol dengan tiga dot pada
kolom Value, seperti ditunjukkan
pada Gambar 4.28.
Gambar 4.23 Memodifikasi string koneksi database
Mengganti Nama dan Menghapus Sumber
Data
Anda tidak bisa mengganti nama sebuah sumber
data karena sumber data merepresentasikan nama dari sebuah kelas DataSet yang dihasilkan oleh Visual
Studio. Pada dasarnya, kelas DataSet
memuat beberapa kelas inner (kelas-kelas yang dideklarasikan di dalam
kelas-kelas lain). Penggantian nama sebuah kelas DataSet, berikut dengan semua kelas yang berelasi dan semua objek
yang menggunakan nama-nama kelas itu adalah hal yang mustahil. Oleh karena itu,
Anda sebaiknya memilih nama untuk sumber data Anda yang Anda sendiri tidak
berencana untuk mengubahnya.
Anda dapat menghapus sebuah sumber data
dengan mudah: Pilih file XSD pada jendela Solution
Explorer dan tekan kunci Delete. Namun, jika program Anda
memiliki satu atau lebih form yang memuat BindingSources
yang terkondeksi dengan sumber data itu, Anda sebaiknya hati-hati. Setelah
menghapus sumber data, Anda tidak akan bisa membuka form apapun pada jendela
Designer yang memuat BindingSources.
Anda akan menemukan pesan error seperti yang ditunjukkan pada Gambar 4.24. Anda
direkomendasikan untuk membuat salinan pendukung untuk projek Anda.
Gambar 4.24 Pesan error yang dihasilkan oleh Visual
Studio setelah sumber data dihapus
Mengikat Sumber Data Ke Sebuah
Kontrol DataGridView
Pada Tutorial 4.1, Anda telah menggunakan
jendela DataGridView Taks untuk memandu Anda menciptakan BindingSource, TableAdapter, dan DataSet.
Jika projek Anda telah memuat sumber data yang diperlukan, Anda dapat mengikatnya
pada sebuah kontrol DataGridView
dengan menggeret tabel StafPenjualan
dari jendela Data Source. Visual Studio akan menambahkan
batang navigasi pada form, seperti ditunjukkan pada Gambar 4.25. Jika batang
navigasi tidak diberikan secara otomatis oleh Visual Studio, Anda bisa
menggeret kontrol BindingNavigator
ke dalam form, dan menetapkan properti BindingSource-nya
menjadi StafPenjualanBindingSource.
Setelah grid diikat pada sebuah DataSet, Anda dapat menetapkan properti
Dock-nya agar ia selalu mengisi
batas-batas form. Untuk melakukannya, pilih grid, lihat jendela Properties, pilih properti Dock, dan klik pada tombol tengah. Grid
akan mengekspansi dan mengisi form. Gambar 4.26 menunjukkan tabel StafPenjualan pada sebuah kontrol DataGridView dengan sebuah toolbar pada
saat aplikasi dijalankan.
Mengikat Bidang-Bidang Pada
Kontrol-Kontrol
Jika jendel Data Sources memuat
sebuah sumber data yang telah ada, Anda dapat dengan mudah menciptakan sebuah
kontrol data-bound untuk tiap kolom dengan menggeret suatu tabel dari sumber
data ke form Anda. Pertama, pilih Details pada dropdown list yang berkaitan
dengan tabel, seperti ditunjukkan pada Gambar 4.27. (Tipe kontrol default
adalah DataGridView, yang telah Anda
gunakan). Ketika Anda menggeret nama tabel ke form, sebuah kontrol diciptakan
untuk setiap bidang. Seperti ditunjukkan pada Gambar 4.28, sebuah toolbar
navigasi juga ditambahkan pada form.
Gambar 4.25 Setelah menggeret tabel StafPenjualan dari jendela Data
Sources pada sebuah form
Gambar 4.26 Form setelah aplikasi dijalankan
Gambar 4.27 Menyeleksi kontrol binding dari sebuah tabel
pada jendela Data Sources
Kadangkala nama-nama kolom pada sumber data
seperti Nama_Depan memuat karakter
garis bawah. Ketika Anda mengikat sumber data ke kontrol-kontrol, Visual Studio
menghapus karakter itu.
Gambar 4.28 Setelah menggeret sebuah sumber data ke
dalam form
Anda bisa jadi ingin memodifikasi tampilan
atau properti dari kontrol. Sebagai contoh, jika Anda ingin kolom Tanggal_Kerja untuk menampilkan format mm/dd/yyyy, Anda bisa menetapkan
properti Format-nya menjadi Short.
Gambar 4.29 Menyeleksi tipe pengikatan kontrol untuk
bidang ID pada jendela Data Sources
Gambar 4.30 Menampilkan salah satu baris dari tabel StafPenjualan pada kontrol-kontrol
terikat
Secara default, kolom-kolom database Text dan Numeric diikat ke kontrol TextBox,
bidang Yes/No diikat ke kotak
periksa, dan bidang DateTime diikat
ke kontrol DateTimePicker. Jika Anda
ingin agar user tidak memodifikasi bidang terproteksi seperti ID, Anda bisa
mengubah tipe kontrol pengikatan pada jendela Data Source. Sebagai
contoh, jika Anda mengklik bidang ID pada tabel StafPenjualan pada jendela Data
Source, maka sejumlah tipe kontrol
akan ditampilkan (Lihat Gambar 4.29). Jika Anda memilih tipe kontrol Label, user dapat melihat bidang itu
tetapi tidak dapat memodifikasi kontennya.
Gambar 4.30 menunjukkan sebuah contoh form
dengan kontrol Label untuk bidang ID
dan beberapa pemodifikasian pada tampilan dari kontrol-kontrol lain.
Mengenalkan Database Karate
Database yang akan digunakan pada beberapa
contoh ke depan dinamakan dengan Karate (Karate.mdf), yang dirancang untuk
keanggotaan dan penjadwalan kelas untuk sekolah bela diri. Sebuah tabel dengan
nama Anggota memuat informasi tentang anggota-anggota, seperti nama depan, nama
belakang, nomor telepon, dan seterusnya. Lihat Tabel 4.3.
Yang berelasi dengan tabel Anggota adalah
tabel Pembayaran, yang ditampilkan
pada Tabel 4.4. Ia menunukkan pembayaran yang dilakukan oleh anggota. Setiap
baris pada tabel Pembayaran memuat Id_Anggota yang mengidentifikasi
anggota (dari tabel Anggota) yang melakukan pembayaran. Relasi ditunjukkan oleh
diagram pada Gambar 4.36. Garis menghubungkan bidang ID pada tabel Anggota
dengan bidang Id_Anggota pada tabel Pembayaran.
Tabel 4.3 Tabel Anggota
dari database Karate
Gambar 4.4 Tabel Pembayaran
Gambar 4.31 Relasi antara tabel Anggota dan tabel Pembayaran,
dilakukan dengan mengklik-ganda pada ikon KarateDataSet
di bawah form
Mengikat Sumber Data Ke Kontrol
Tipe-List
ListBox dan ComboBox
merupakan perangkat ideal untuk menampilkan daftar item dan membiarkan user
memilih item-item. Apa yang perlu Anda lakukan adalah menetapkan
properti-properti berikut:
- Properti DataSource mengidentifikasi sebuah tabel data yang akan menyediakan data database.
- Properti DisplayMember mengidentifikasi kolom di dalam tabel yang akan ditampilkan pada ListBox atau ComboBox.
Properti ValueMember
mengidentidikasi kolom di dalam tabel yang menyediakan nilai pengidentifikasi
ketika sebuah item diseleksi pada kotak list. Nilai pengidentifikasi dihasilkan
pada properti SelectedValue dari
kotak list. Umumnya, properti ValueMember
memuat nama dari kunci primer (primary
key) dari tabel karena bidang itu secara unik mengidentifikasi setiap entri
tabel.
Ketika Anda menggunakan mouse untuk menggeret
sebuah kolom tabel dari jendela Data
Source pada sebuah ListBox atau ComboBox, Visual Studio secara otomatis menciptakan
komponen-komponen data yang diperlukan: sebuah DataSet, sebuah BindingSource,
dan sebuah Table Adapter. Ketika Anda mengklik smart tag
di atas dari sebuah ListBox atau ComboBox, sebuah dialog akan
mempermudah menetapkan sejumlah properti. Contohnya ditampilkan pada Gambar
4.32.
Gambar 4.32 Menetapkan sejumlah opsi pengikatan-data
dari sebuah kontrol ListBox
ListBox atau ComboBox
data-bound merupakan perangkat navigasi yang sangat berguna. Ketika user
menyeleksi sebuah item di dalam list, BindingSource
dari form akan mereposisi dirinya pada baris DataSet yang cocok dengan nilai terseleksi. Semua bidang lain yang
terikat pada DataSet yang sama pada
form akan diperbarui secara otomatis. Tutorial 4.3 akan menunjukkan bagaimana
ini dilakukan.
Tutorial 4.3: Menampilkan Tabel Anggota Pada Sebuah
ListBox
Pada tutorial
ini, Anda menampilkan sejumlah nama belakang dari anggota dari tabel Anggota pada database Karate. Ketika user mengklik nama dari
seorang anggota, program akan menampilkan tanggal kapan anggota itu bergabung.
Langkah-Langkah Tutorial
Langkah 1: Ciptakanlah sebuah aplikasi Windows Forms Application dengan nama Daftar Anggota.
Langkah 2: Klik Add New
Data Source pada jendela Data
Sources. (Jika Anda tidak dapat melihat jendela Data Sources, pilih menu VIEW
dan klik Other Windows dan kemudian klik Data
Sources.
Langkah 3: Ikuti langkah-langkah pada Data Source Configuration Wizard untuk menciptakan sebuah koneksi
ke tabel Anggota pada file database
Karate.mdf. Namai DataSet dengan KarateDataSet.
Langkah 4: Tetapkan properti Text
dari form menjadi Daftar Anggota.
Langkah 5: Tambahkan sebuah kontrol ListBox pada form dan namai dengan listAnggota.
Langkah 6: Tambahkan sebuah kontrol Label di atas kotak list dan tetapkan properti Text-nya menjadi Nama-Nama Anggota. Form Anda akan tampak seperti ditunjukkan pada Gambar 4.33.
Gambar 4.33 Program Daftar
Anggota dengan sebuah kotak list
Langkah 7: Klik pada smart tag dari ListBox, yang menyebabkan jendela ListBox Tasks ditampilkan, seperti ditunjukkan pada Gambar 4.34.
Pilih kotak periksa Data Bounds Items.
Gambar 4.34 Jendela ListBox
Tasks
Jendela ListBox Tasks, yang ditunjukkan pada Gambar 4.35, sekarang memuat beberapa
bidang databinding.
Gambar 4.35 Jendela ListBox
Tasks
Langkah 8: Pilih dropdown list Data Source, ekspansi
grup Other Data Source, ekspansi Project Data Sources, ekspansi KarateDataSet, dan pilih tabel Anggota
(ditunjukkan pada Gambar 4.36). Perhatikan bahwa Visual Studio telah
menambahkan tiga komponen pada component tray di bawah form: sebuah DataSet, sebuah BindingSource, dan sebuah TableAdapter.
Gambar 4.36 Pengaturan properti DataSource pada kotak list
Langkah 9: Ketika masih pada jendela ListView Tasks, tetapkan
properti DisplayMember menjadi Nama_Belakang.
Langkah 10: Simpan dan jalankan aplikasi. Kotak list sekarang telah
memuat nama belakang dari tiap anggota seperti ditunjukkan pada Gambar 4.37.
Tutup jendela dan kembali ke mode Design.
Gambar 4.37 Kotak list terisi, saat aplikasi dijalankan
Langkah 11: Selanjutnya, Anda menambahkan sebuah label data-bound
pada form yang menampilkan nomor telepon dari anggota. Klik bidang Telepon pada jendela Data Source, pilih Label dari
dropdown list, dan geret bidang Telepon
dengan mouse ke form. Tetapkan properti BorderStyle
menjadi Fixed 3D.
Langkah 12: Simpan dan jalankan aplikasi. Ketika Anda mengklik nama
dari tiap anggota, perhatikan bagaimana nomor telepon ditampilkan. Sebagai
contoh, lihat Gambar 4.38. Analisa apa yang terjadi di sini. Ketika user
menyeleksi sebuah nama di dalam kotak list, mekanisme pengikatan-data pada form
akan memindahkan baris DataSet yang
memuat nama anggota. Kontrol Label
terikat pada bidang Telepon, jadi ia
menampilkan nomor telepon dari anggota yang diseleksi pada kotak list.
Gambar 4.38 Nomor telepon dari anggota terseleksi
ditampilkan pada sebuah Label
Langkah 13: Untuk setiap bidang lain pada jendela Data Sources, pilih dropdown list dan pilih tipe kontrol Label. Kemudian geret tiap bidang
tersebut ke form. Tetapkan properti BorderStyle
dari tiap label menjadi Fixed 3D. Ketika Anda menjalankan aplikasi,
ia akan ditampilkan seperti pada Gambar 4.39.
Gambar 4.39 Menampilkan bidang-bidang lain pada kontrol Label
Langkah 14: Simpan projek dan jalankan aplikasi. Klik pada sejumlah
nama anggota, dan verifikasi bahwa kontrol-kontrol Label mengubah nilainya.
Langkah 15: Tutup aplikasi.
Menambahkan Baris-Baris Pada
DataTable Menggunakan Metode NewRow
Kelas DataTable
memiliki dua metode yang membantu Anda untuk menambahkan baris-baris pada tabel
dalam DataSet: NewRow dan Add. Metode NewRow menciptakan dan menghasilkan
sebuah baris kosong baru yang memiliki struktur sama seperti baris-baris lain
pada tabel. Metode ini dideklarasikan sebagai berikut:
NewRow()
As DataRow
Berikut adalah contoh pemanggilan sederhana
terhadap NewRow, menggunakan tabel
Pembayaran di dalam sebuah DataSet
dengan nama PembayaranDataSet:
Dim
baris As DataRow
baris
= PembayaranDataSet.Pembayaran.NewRow()
Karena NewRow
menghasilkan sebuah tipe DataRow
umum, nilai baliknya harus dikonversi menjadi sebuah tipe PembayaranRow sebelum Anda mengakses setiap bidang pada tabel
Pembayaran. Kode berikut mendefinisikan-ulang baris dan menunjukkan bagaimana
konversi dilakukan:
Dim baris As PembayaranDataSet.PembayaranRow
baris = CType (PembayaranDataSet.Pembayaran.NewRow,
PembayaranDataSet. PembayaranRow)
Selanjutnya, Anda dapat menugaskan nilai
kepada tiap kolom di dalam tabel. Nama kolom adalah properti-properti pada
kelas PembayaranDataSet.PembayaranRow.
With
baris
.Id_Anggota = 5
.Tanggal_Pembayaran = '5/15/2015'
.Jumlah = 50000
End
With
Langkah terakhir adalah menambahkan baris
baru pada tabel dengan memanggil metode Add
dari koleksi Rows. Berikut adalah
bagaimana metode ini dideklarasikan:
Function
Add(baris As DataRow) As DataRow
Dengan melanjutkan contoh yang sama, statemen
berikut menambahkan baris pada tabel Pembayaran:
PembayaranDataSet.Pembayaran.Rows.Add(baris)
Menggunakan Metode Rows.Add
Metode Rows.Add
menambahkan sebuah baris pada suatu DataTable.
Ketika memanggil metode Rows.Add,
Anda melewatkan nilai-nilai dari kolom baru kepada metode itu. Kode berikut
menambahkan sebuah entri baru pada tabel Anggota
dari AnggotaDataSet:
AnggotaDataSet.Anggota.Rows.Add(15,
Joni, Samy, 111-2222, ‘5/15/2015’)
Jika kunci primer dari tabel pada database
adalah sebuah bidang oto-generasi, Anda sebaiknya melewatkan nilai Nothing pada argumen terkait pada
metode Add. Berikut adalah sebuah
contoh dari tabel Pembayaran, di
mana di dalamnya kolom pertama adalah oto-generasi:
PembayaranDataSet.Pembayaran.Rows.Add(Nothing,
5, ‘5/15/2015’, 50000)
Memperbarui DataTable
Penambahan sebuah baris pada suatu DataTable tidak memengaruhi database.
Jika Anda ingin menyalin perubahan yang ada ke dalam database, Anda perlu
memanggil metode Update dari TabelAdapter yang berkaitan dengan DataTable. Statemen berikut, misalnya,
menuliskan semua perubahan pada tabel Pembayaran (di dalam PembayaranDataSet) ke dalam database:
PembayaranTableAdapter.Update(PembayaranDataSet.Pembayaran)
Karena sebuah DataSet dapat memuat sejumlah tabel, pembaruan sebuah DataSet dapat menyebabkan perubahan
pada semua tabel. Statemen berikut memperbarui semua tabel di dalam PembayaranDataSet:
PembayaranTableAdapter.Update(PembayaranDataSet)
Penyisipan Langsung Menggunakan
TableAdapter
Untuk menambahkan sebuah baris pada suatu
tabel database, Anda memanggil metode Insert dari TableAdapter. Anda melewatkan kepadanya nilai-nilai kolom yang
diperlukan, dengan mengabaikan bidang-bidang oto-generasi. Pada contoh
selanjutnya, PembayaranTableAdapter
menambahkan sebuah baris pada tabel Pembayaran,
yang melewatkan ID, tanggal pembayaran, dan jumlah pembayaran:
PembayaranTableAdapter.Insert(5,
‘5/15/2015’, 50000)
Menghapus Sebuah Baris Dari DataTable
Penghapusan sebuah baris dari suatu DataTable dilakukan dalam dua langkah.
Pertama, Anda membaca suatu referensi terhadap baris yang ingin dihapus; kedua,
Anda memanggil metode Rows.Remove,
melewatkan kepadanya referensi baris. Sebagai contoh, kode berikut memanggil FindByID, melewatkan kepadanya ID dari
pembayaran yang akan dihapus. Kemudian, objek baris yang dihasilkan oleh FindByID dilewatkan kepada metode Rows.Remove:
Dim
baris As DataRow = PembayaranDataSet.Pembayaran.FindByID(36)
PembayaranDataSet.Payments.Rows.Remove(baris)
Pada Tutorial 4.4, Anda akan menuliskan sebuah program yang menambahkan baris-baris pada suatu tabel database.
Tutorial 4.4: Menyisipkan Baris-Baris Ke Tabel Pembayaran
Pada tutorial
ini, Anda akan menciptakan sebuah aplikasi yang menambahkan baris-baris pada
tabel Pembayaran di dalam database Karate.
Langkah-Langkah Tutorial
Langkah 1: Ciptakanlah sebuah aplikasi Windows Forms Application dengan nama Sisipkan Pembayaran.
Langkah 2: Pada jendela Data
Sources, tambahkan sebuah sumber
data baru, menggunakan tabel Pembayaran
dari database Karate. Pilih Karate.mdf. Namai DataSet dengan PembayaranDataSet.
Langkah 3: Ketika ditanya apakah Anda ingin menyalin file database
ke dalam projek Anda, jawab Yes.
Langkah 4: Tambahkan tiga kontrol TextBox pada form dengan label-label yang sesuai. Satu kontrol
dengan nama teksIdAnggota, yang lain
teksTanggal, dan yang ketiga dengan
nama teksJumlah. Gunakan Gambar 4.40
sebagai panduan.
Gambar 4.40 Form startup pada aplikasi Sisipkan Pembayaran
Langkah 5: Tambahkan sebuah kontrol Button dengan nama tombolSisipkan
dan tetapkan properti Text-nya
dengan Sisipkan.
Langkah 6: Tambahkan sebuah kontrol DataGridView pada form dan tetapkan properti-properti berikut: Name = dgvPembayaran; BorderStyle: None;
BackgroundColor = Control; ReadOnly = True; RowHeadersVisible = False; Anchor =
Top, Bottom, Left, Right.
Langkah 7: Buka jendela DataGridView
Tasks dari grid dan tetapkan properti DataSource-nya
menjadi tabel Pembayaran dari PembayaranDataSet.
Langkah 8: Pilih properti Columns
dari grid, yang membuka jendela Edit
Columns. Hapus kolom ID. Kolom-kolom
tersisa ditampilkan pada Gambar 4.41a.
Gambar 4.41a Mengedit properti Columns dari grid dgvPembayaran
Langkah 9: Masih pada jendela Edit
Columns, pilih kolom Id_Anggota, dan buka properti DefaultCellStyle pada kotak list
sebelah kanan. Jendela CellStyle Builder akan ditampilkan.
Langkah 10: Pada jendela CellStyle
Builder, tetapkan properti-properti
berikut: Alignment = MiddleCenter;
ForeColor = Blue. Klik tombol OK untuk menutup jendela.
Langkah 11: Pada jendela Edit
Columns, pilih kolom Jumlah dan buka properti DefaultCellStyle-nya.
Langkah 12: Buka properti Format
dan pilih Numeric.
Langkah 13: Klik tombol OK
untuk menutup jendela CellStyle Builder.
Langkah 14: Lakukan eksperimen dengan tiga tombol, ubah warna dan
format yang Anda inginkan. Ketika selesai, klik OK untuk menutup jendela Edit
Columns.
Langkah 15: Simpan dan jalankan aplikasi. Anda akan melihat form
seperti ditampilkan di bawah ini:
Gambar 4.41b Form setelah dilakukan sejumlah modifikasi
Langkah 16: Selanjutnya, Anda akan menambahkan kode untuk event
handler Click dari tombol Sisipkan sehingga user dapat
menciptakan dan menyimpan pembayaran baru. Pada mode Design, klik ganda tombol Sisipkan
dan tambahkan kode berikut:
Private Sub tombolSisipkan_Click(…) Handles
tombolSisipkan.Click
Try
PembayaranTableAdapter.Insert(Nothing,
CShort(teksIdAnggota.Text),
CDate(teksPembayaran.Text),
CInt(teksJumlah.Text))
Me.PembayaranTableAdapter.Fill(Me.PembayaranDataSet.Pembayaran)
Catch
ex As Exception
MessageBox.Show(ex.Message, "Error Database")
End
Try
End Sub
Anda
menggunakan statemen Try-Catch di sini untuk menangani eksepsi
yang dilempar oleh database. Kode yang Anda tambahkan memanggil metode Insert dari TableAdapter, melewatkan kepadanya nilai-nilai dari ketiga kolom:
Id Anggota, tanggal pembayaran, dan jumlah pembayaran. Setiap argumen harus
dikonversi menjadi sebuah tipe yang cocok dengan tipe kolom DataSet. Kemudian perintah Fill
dipanggil sehingga user dapat melihat pembayaran barus pada grid.
Langkah 17: Tambahkan kode berikut pada event handler Load dari form. Anda ingin kotak teks
menampilkan tanggal hari ini:
'menetapkan tanggal sekarang pada kotak teks
teksPembayaran.Text = FormatDateTime(Today,
DateFormat.ShortDate)
Langkah 18: Simpan projek dan jalankan aplikasi. Tambahkan sebuah
pembayaran baru, menggunakan nilai Id_Anggota
antara 1 dan 9. Verifikasi bahwa pembayaran Anda ditampilkan pada grid setelah
Anda mengklik tombol Sisip.
Perhatikan Gambar 4.41c.
Gambar 4.41c Grid setelah disisipkan pembayaran baru
Gambar 4.42 Pesan error ditampilkan ketika user mencoba
menambahkan sebuah baris pembayaran, dengan Id_Anggota yang tidak ada
Langkah 19: Tambahkan sebuah pembayaran dengan Id_Anggota 134. Id_Anggota
ini tidak ada pada tabel Anggota, sehingga Anda akan melihat pesan error
(seperti ditunjukkan pada Gambar 4.42) yang mengatakan bahwa Anda melanggar
kekangan kunci primer. Pembayaran tidak disimpan.
Langkah 20: Tambahkan sebuah pembayaran menggunakan format tanggal
yang tak valid atau menggunakan nilai tak-numerik untuk jumlah pembayaran.
Ketika Anda mengklik tombol Sisip, amati pesan error yang dihasilkan oleh
database.
Langkah 21: Tutup aplikasi.
Menggunakan Loop pada DataSet
Teknik-teknik yang telah Anda pelajari
tentang loop dan koleksi pada bab-bab terdahulu juga berlaku untuk DataSet. Anda dapat beriterasi pada
koleksi Rows dari sebuah DataTable
menggunakan statemen For Each.
Loop berikut beriterasi pada tabel Pembayaran dari PembayaranDataSet, yang menambahkan kolom Jumlah pada suatu total. DataSet dibangun dari tabel Pembayaran di dalam database Karate:
Dim baris As PembayaranDataSet.PembayaranRow
Dim decTotal As Decimal = 0
For Each baris In PembayaranDataSet.Pembayaran.Rows
decTotal +=
baris.Jumlah
Next
Pada Tutorial 4.5, Anda akan memodifikasi
aplikasi Sisipkan Pembayaran.
Tutorial 4.5: Menambahkan Sebuah Total Pada Aplikasi
Sisipkan Pembayaran
Pada tutorial
ini, Anda akan menambahkan beberapa statemen yang menghitung jumlah total dari
pembayaran-pembayaran oleh siswa-siswa di sekolah karate.
Langkah-Langkah Tutorial
Langkah 1: Salin program Sisipkan
Pembayaran yang telah Anda ciptakan
pada Tutorial 4.4. Berikan nama baru Sisipkan
Pembayaran Total.
Langkah 2: Tambahkan sebuah tombol baru pada form. Tetapkan
properti-propertinya sebagai berikut: Name
= tombolTotal; Text = Total Pembayaran.
Langkah 3: Klik ganda pada tombol baru tersebut dan modifikasi
handler Click-nya sehingga ia memuat
kode berikut:
Private Sub tombolTotal_Click(…) Handles
tombolTotal.Click
Dim decTotal As Decimal = 0
Dim baris As PembayaranDataSet.PembayaranRow
For Each baris In
PembayaranDataSet.Pembayaran.Rows
decTotal += baris.Jumlah
Next
MessageBox.Show("Total
pembayaran sebesar " &
"Rp.
" & decTotal.ToString(), "Total")
End Sub
Langkah 4: Simpan projek dan jalankan aplikasi. Klik pada tombol Total
Pembayaran dan amati hasilnya.
Contoh keluaran program ditampilkan pada Gambar 4.43.
Gambar 4.43 Menghitung total pembayaran pada tabel Pembayaran di dalam database Karate
Langkah 5: Akhiri aplikasi.
4.3 Fokus Pada Penyelesaian Permasalahan: Manajer
Sekolah Karate
Di sini, Anda akan merancang aplikasi Manajer Sekolah Karate, dengan
form startup sebagai berikut:
Gambar 4.44 Form startup aplikasi Manajer Sekolah Karate
Berikut adalah seleksi-seleksi yang
disajikan:
File
Keluar
Membership
Tampilkan Semua
Cari Anggota
Tambahkan Anggota Baru
Payments
Semua
Satu Anggota
Berikut adalah form Tampilkan Semua pada aplikasi ini:
Gambar 4.45 Form Tampilkan
Semua dari aplikasi Manajer Sekolah Karate
Berikut adalah form Cari Anggota pada aplikasi ini:
Gambar 4.46 Form Cari
Anggota dari aplikasi Manajer Sekolah Karate
Berikut adalah form Tambahkan Anggota Baru pada aplikasi ini:
Gambar 4.47 Form Tambahkan
Anggota Baru dari aplikasi Manajer
Sekolah Karate
Berikut adalah form Semua Pembayaran pada aplikasi ini:
Gambar 4.48 Form Semua
Pembayaran dari aplikasi Manajer
Sekolah Karate
Berikut adalah form Pembayaran Satu Anggota pada aplikasi ini:
Gambar 4.49 Form Pembayaran
Satu Anggota dari aplikasi Manajer
Sekolah Karate
Tutorial 4.6: Menciptakan Form Startup Manajer Sekolah
Karater
Pada tutorial
ini, form akan memuat nama program, informasi versi, dan sebuah kontrol MenuStrip. Ia akan selalu menjadi form
pertama dibuka dan form terakhir ditutup ketika aplikasi dihentikan.
Langkah-Langkah Tutorial
Langkah 1: Ciptakanlah sebuah Windows
Forms Application dengan nama Manajer
Sekolah Karate.
Langkah 2: Namai form dengan nama FormUtama.vb.
Langkah 3: Buka FormUtama
dan tetapkan properti-properti berikut: Size
= 530, 275; Text = Manajer Sekolah Karate, StartPosition = CenterScreen;
MaximizeBox = False; FormBorderStyle = FixedSingle.
Langkah 4: Sisipkan sebuah kontrol Panel pada form dan tetapkan properti Size menjadi 390, 115. Sisipkan kontrol Panel lain di dalam panel pertama dan tetapkan properti Size menjadi 360, 80. Tetapkan properti
BorderStyle untuk kedua panel
menjadi Fixed3D.
Langkah 5: Sisipkan sebuah kontrol Label di dalam panel yang lebih kecil dan tetapkan properti Text menjadi Sekolah Karate Tarabunga. Anda menggunakan 24-point,
bold, italic Monotype Corsiva.
Langkah 6: Tambahkan kontrol Label
lain di sekitar bawah form dan tetapkan properti Text menjadi Sistem
Manajemen 1.0. Anda menggunakan 11.25-point, bold Arial font.
Langkah 7: Tambahkan sebuah kontrol MenuStrip pada form dan sisipkan item-item menu berikut:
&File
K&eluar
&Keanggotaan
T&ilkan
Semua
&Cari
Anggota
&Tambahkan
Anggota Baru
&Pembayaran
&Semua
Sat&u
Anggota
Langkah 8: Klik ganda pada item menu File | Keluaran dan sisipkan kode berikut ke dalam event handler Click-nya:
Me.Close()
Langkah 9: Simpan projek dan jalankan aplikasi. Verifikasi bahwa
form menutup ketika Anda mengklik item menu File | Keluar.
Anda selasai.
Tutorial 4.7 akan fokus pada penambahan subsistem Keanggotaan pada aplikasi.
Tutorial 4.7: Manajer Sekolah Karate: Menampilkan Semua
Anggota
Pada tutorial
ini, Anda akan menggunakan sebuah kontrol DataGridView
untuk menampilkan semua anggota pada sekolah karater. Sebuah sumber data baru
akan ditambahkan pada projek, dan DataGridView
akan diikat dengan sumber data tersebut.
Langkah-Langkah Tutorial
Langkah 1: Buka projek Manajer
Sekolah Karate.
Langkah 2: Tambahkan sebuah form baru dengan nama FormSemuaAnggota.vb pada projek.
Tetapkan properti MinimizeBox dan MaximizeBox menjadi False. Tetapkan properti Text menjadi Semua Anggota.
Langkah 3: Pada FormUtama,
ciptakan sebuah handler Click untuk
item menu Keanggotaan | Tampilkan Semua
dan sisipkan kode berikut:
Langkah 4: Pada jendela Data
Sources, pilih Add New Data Sources.
Ciptakan sebuah koneksi ke database Karate.
Pada jendela Choose Your Database
Objects, pilih tabel Anggota dan
namai DataSet sebagai KarateDataSet. Klik tombol Finish untuk menyimpan DataSet.
Langkah 5: Tempatkan sebuah kontrol DataGridView pada form FormSemuaAnggota
dan namai dengan dgvAnggota. Tetapkan
properti Anchor ke semua sisi form.
Tetapkan properti-properti berikut: BackGroundColor
= Control; BorderStyle = None; RowHeadersVisible = False.
Langkah 6: Pada form yang sama, buka jendela DataGridView Tasks. Pada
Choose Data Source, pilih tabel
Anggota dari KarateDataSet. Centang kotak periksa Enable Editing dan Enable Deleting. Jika kepala-kepala kolom tidak terlihat seperti pada
Gambar 4.50, edit properti Columns
dan gunakan tombol anak-panah di samping daftar nama kolom untuk
memperbaikinya.
Gambar 4.50 Tataletak kolom untuk tabel Anggota
Gambar 4.51 Menampilkan semua anggota
Langkah 7: Ketika masih mengedit properti Columns, pilih kolom Tanggal_Bergabung,
dan pilih properti DefaultCellStyle.
Masukkan d ke dalam properti Format. (Format ini akan menetapkan
format tanggal pendek, dengan format m/d/yyyy. Klik tombol OK dua kali untuk
menutup editor Columns.
Langkah 8: Tambahkan sebuah kontrol MenuStrip pada form. Tambahkan sebuah item menu File, dengan satu subitem: Tutup. Pada handler Click dari item Tutup, sisipkan statemen Me.Close().
Langkah 9: Simpan projek dan jalankan aplikasi. Dari menu form
startup, pilih Keanggotaan | Tampilkan
Semua. Anda akan melihat seperti ditunjukkan pada Gambar 4.51.
Langkah 10: Akhiri aplikasi.
Tutorial 4.8: Manajer Sekolah Karate: Menambahkan Anggota
Baru
Pada tutorial
ini, Anda akan menambahkan sebuah form baru pada program Manajer Sekolah Karate yang membiarkan user menambahkan
baris-baris baru pada tabel Anggota.
Form akan menggunakan pengikatan data dan menuliskan perubahan secara langsung
pada database.
Langkah-Langkah Tutorial
Langkah 1: Buka projek Manajer
Sekolah Karate.
Langkah 2: Tambahkan sebuah form baru pada projek dengan nama FormTambahAnggota.vb. Tetapkan properti
Text-nya menjadi Menambah Anggota Baru. Tetapkan
nilai-nilai properti berikut: Maximize =
False; Minimize = False; FormBorderStyle = FixedDialog.
Gambar 4.52a Form Menambah
Anggota Baru
Langkah 3: Pada FormUtama,
lihat pada item menu Keanggotaan |
Tambahkan Anggota Baru; klik ganda pada item itu dan sisipkan statemen
berikut di dalam event handler Click-nya:
FormTambahAnggota.ShowDialog()
Langkah 4: Pada jendela Data
Sources, cari tabel Anggota di bawah entri KarateDataSet. Dengan mengklik anak-panah
yang ada di kanannya, pilih Details.
Langkah 5: Geret tabel Anggota
ke form. Visual Studio akan secara otomatis menciptakan bidang-bidang
data-bound dan sebuah ToolStrip
dengan nama AnggotaBindingNavigator.
Tetapkan properti Format dari
kontrol DateTimePicker menjadi Short. Gunakan Gambar 4.52a sebagai
panduan.
Langkah 6: Hapus komponen AnggotaBindingNavigator
dari component tray di bawah form.
Buka jendela Code dari form dan
hapus metode AnggotaBindingNavigatorSaveItem_Click.
Langkah 7: Ganti kode di dalam event handler Load dari form dengan sebuah statemen yang memanggil metode AddNew.
AnggotaBindingSource.AddNew()
Statemen ini
membersihkan bidang-bidang masukan form dan menunggu user memasukkan data untuk
anggota baru.
Langkah 8: Tambahkan sebuah kontrol MenuStrip pada form. Tambahkan item menu File denga satu sub item: Tutup.
Di dalam event handler Click untuk
item pertama, sisipkan statemen Me.Close().
Langkah 9: Ciptakan sebuah event handler FormClosing untuk form dan sisipkan statemen berikut:
AnggotaBindingSource.CancelEdit()
Statemen ini
membatalkan semua operasi edit yang sedang terjadi. User bisa saja membuka
form, mulai mengisi bidang-bidang, tetapi mengubah pikirannya, dan memutuskan
menutup form.
Langkah 10: Ganti nama kontrol DateTimePicker
menjadi dtpTanggal. Selain itu,
tambahkan baris berikut pada event handler Load
dari form:
dtpTanggal.Value = Today
Ini
diperlukan untuk memastikan bahwa nilai tanggal akan disimpan dalam database
meskipun user secara eksplisit tidak memilih tanggal.
Gambar 4.52b Sebuah anggota baru berhasil ditambahkan ke
dalam database
Langkah 11: Tambahkan sebuah tombol pada form dengan nama tombolSimpan. Ubah properti Text-nya menjadi Simpan dan Tutup. Ciptakan sebuah handler untuk tombol itu. Ia
memanggil EndEdit untuk
menyempurnakan operasi penambahan baris baru. Kemudian ia memanggil Update untuk menyimpan modifikasi DataSet ke dalam database aktual.
Terakhir, ia menutu form, sebagai berikut:
Private Sub tombolSimpan_Click(…) Handles
tombolSimpan.Click
Try
AnggotaBindingSource.EndEdit()
AnggotaTableAdapter.Update(KarateDataSet.Anggota)
Me.Close()
Catch
ex As Exception
MessageBox.Show(ex.Message, "Error")
End
Try
End Sub
Baris 12: Simpan projek dan jalankan aplikasi. Klik item menu Keanggotaan | Tambahkan Anggota Baru dan tambahkan anggota
baru. Pilih nomor ID yang tidak ada di dalam daftar anggota. Jika Anda tidak
yakin, tampilkan lebih dahulu semua daftar anggota. Perhatikan gambar di bawah
ini.
Menggunakan Parameter Query
Dalam mencari query terhadap rekaman-rekaman
terseleksi di dalam tabel-tabel database, Anda tidak mengetahui nilai-nilai apa
yang ingin dicari oleh user. Meskipun dimungkinkan untuk membangun sebuah query
dari suatu statemen SELECT yang
telah ada, tetapi hasilnya tidak baik. Dimisalkan bahwa user telah memasukkan
sebuah nama di dalam kontrol teksNamaBelakang,
dan Anda ingin menuliskan sebuah query yang mencari semua baris pada tabel
Anggota yang memiliki nama belakang yang sama. Anda dapat membangun query
berikut:
Dim
query As String
query
= “SELECT ID, Nama_Belakang, Nama_Depan, Telepon, Tanggal_Bergabung” & “FROM
Anggota WHERE Nama_Belakang = ‘” & teksNamaBelakang.Text & “’”
Ketika menuliskan kode semacam ini, Anda
dapat dengan mudah melakukan kesalahan. Pendekatan yang lebih baik adalah
dengan menyisipkan sebuah nama parameter secara langsung ke dalam query SQL.
Pada contoh berikut, sebuah parameter dengan nama @Nama_Belakang akan ditugasi suatu nilai spesifik pada saat
aplikasi dijalankan:
SELECT ID, Nama_Belakang,
Nama_Depan, Telepon, Tanggal_Bergabung
FROM Anggota
WHERE
Nama_Belakang = @Nama_Belakang
Ketika metode Fill dari TableAdapter
dipanggil, Anda melewatkannya argumen kedua. Nilai argumen itu secara otomatis
ditugaskan kepada parameter query:
AnggotaTableAdapter.Fill(Me.CariAnggotaDataSet.Anggota,
teksNamaBelakang.Text)
Jika sebuah query memuat lebih dari satu
parameter, nilai-nilai parameter menjadi argumen-argumen tambahan bagi metode Fill. Query berikut memuat dua
parameter, @Nama_Belakang dan @Tanggal_Bergabung:
SELECT ID, Nama_Belakang,
Nama_Depan, Telepon, Tanggal_Bergabung
FROM Anggota
WHERE
Nama_Belakang = @Nama_Belakang AND Tanggal_Bergabung <= @Tanggal_Bergabung
Perhatikan bagaimana memanggil metode Fill:
AnggotaTableAdapter.Fill(Me.CariAnggotaDataSet.Anggota,
teksNamaBelakang.Text,
teksTanggalBergabung.Text)
Kecocokan Wildcard pada Query SQL
Ketika melakukan pencarian pada baris-baris
yang cocok di dalam suatu tabel database, Anda tidak selalu mengetahui nilai
persis dari apa yang ingin Anda cari. SQL memberikan katakunci spesial dengan
nama LIKE yang menggunakan karakter
wildcard untuk melakukan pencocokan. SQL Server menggunakan tanda persen (%)
untuk mencocokkan sembarang string karakter. Sebagai contoh, klausa WHERE
berikut menghasilkan semua baris yang memuat sebuah nama yang diawali dengan
huruf G:
WHERE
Nama_BElakang LIKE 'G%'
Database akan menghasilkan baris-baris yang
memuat nama-nama belakang seperti Gono, Gini, Gina, dan lainnya.
Pada Tutorial 4.9, Anda akan menciptakan
sebuah form yang membiarkan user untuk melakukan pencarian terhadap
karakter-karakter wildcard.
Tutorial 4.9: Manajer Sekolah Karate: Mencari Anggota
Berdasarkan Nama
Pada tutorial
ini, Anda akan menciptakan sebuah form untuk aplikasi Manajer Sekolah Karater yang membiarkan user untuk melakukan
pencarian anggota menggunakan nama belakangnya. Query yang melakukan pencarian
akan menerima string parsial, jadi jika user tidak mengetahui ejaan eksak untuk
nama anggota, ia dapat melihat sejumlah nama anggota dengan nama-nama yang
hampir sama.
Langkah-Langkah Tutorial
Langkah 1: Buka projek Manajer Sekolah Karate.
Langkah 2: Tambahkan sebuah form baru pada projek dengan nama FormCariAnggota.vb. Tetapkan
properti-propertinya sebagai berikut: Text
= Cari Anggota Dengan Nama Belakang; MaximizeBox = False; MinimizeBox = False;
StartPosition = CenterScreen; FormBorderStyle = FixedDialog.
Langkah 3: Pada FormUtama.vb,
klik ganda pada item menu Keanggotaan |
Cari Anggota dan sisipkan kode berikut di dalam event handlernya:
FormCariAnggota.ShowDialog()
Langkah 4: Buka FormCariAnggota
pada mode Design, tambahkan sebuah
kontrol MenuStrip pada form dan
ciptakan sebuah submenu File dengan
satu seleksi: Tutup. Di dalam event
handler Click-nya, sisipkan statemen
Me.Close().
Langkah 5: Tambahkan sebuah kontrol Label, sebuah TextBox
dengan nama teksNamaBelakang, dan
sebuah Button dengan nama tombolGo pada form. Gunakan Gambar 4.53
sebagai panduan. (Kontrol DataGridView
akan ditambahkan pada langkah nanti).
Gambar 4.53 Form Cari Anggota pada mode Design
Langkah 6: Buka file KarateDataSet.xsd,
klik kanan pada AnggotaTabelAdapter,
pilih Add, dan kemudian pilih Query. Sisipkan query SQL berikut:
SELECT ID, Nama_Belakang, Nama_Depan,
Telepon, Tanggal_Bergabung
From Anggota
WHERE (Nama_Belakang LIKE @nama + ‘%’)
Setelah
menciptakan query SQL, klik tombol Next.
Pada langkah Choose Methods to Generate
yang ditunjukkan pada Gambar 4.54, pilih hanya opsi Fill a DataTable dan beri nama metode dengan CariAnggota. Setelah Anda selesai menambahkan query, AnggotaTabelAdapter akan ditampilkan
seperti pada Gambar 4.55.
Gambar 4.54 Memilih nama dari metode TableAdapter
Gambar 4.55 AnggotaTableAdapter, setelah penambahan query CariAnggota
Langkah 7: Tempatkan sebuah kontrol DataGridView pada form dan namai dengan dgvAnggota. Tetapkan properti-propertinya sebagai berikut: BackGroundColor = Control; BorderStyle =
None; Anchor = Bottom, Left, Right; RowHeadersVisible = False.
Langkah 8: Dengan menggunakan smart tag di pojok kanan-atas,
tetapkan sumber data menjadi tabel Anggota
dari KarateDataSet. Nonaktifkan
penambahan, pengeditan, dan penghapusan baris.
Langkah 9: Selanjutnya, Anda menambahkan pemanggilan terhadap
metode Fill di dalam event handler
untuk tombol yang mengaktifkan pencarian. Klik ganda pada tombol Go! dan sisipkan kode ini di dalam
event handlernya:
'melakukan pencarian wildcard untuk nama
belakang
Me.AnggotaTableAdapter.CariAnggota(KarateDataSet.Anggota,
teksNamaBelakang.Text)
Normalnya,
metode Fill hanya memiliki satu
parameter, yaitu tabel dari DataSet.
Tetapi di sini Anda melewatkan dua parameter, yang merupakan nilai yang akan
ditugaskan kepada parameter query.
Langkah 10: Pilih form dengan mouse dan tetapkan properti AcceptButton dari form menjadi tombolGo. Ini akan memampukan user
untuk menekan kunci Enter ketika mengaktivasi pencarian.
Gambar 4.56 Pencarian anggota berdasarkan nama belakang
Langkah 11: Hapus semua statemen yang ada di dalam event handler Load dari form (Anda tentu tidak ingin
mengisi data sebelum nama anggota dimasukkan untuk dicari).
Langkah 12: Simpan projek dan jalankan aplikasi. Dari form startup,
klik Keanggotaan | Cari Anggota dari
menu. Ketika form Cari Anggota
ditampilkan, masukkan nama parsial dari menu, seperti si, dan klik tombol Go!. Keluaran akan tampak seperti
ditunjukkan pada Gambar 4.56.
Pada Tutorial 4.10, Anda akan mampu menjejak
pembayaran-pembayaran untuk sekolah Karate.
Tutorial 4.10: Manajer Sekolah Karate: Menampilkan Semua
Pembayaran
Pada tutorial
ini, Anda akan menggunakan tabel Pembayaran,
yang memuat tanggal, ID anggota, dan jumlah pembayaran. Ia tidak memuat nama
anggota. Anda akan menggabungkan tabel Pembayaran
dan tabel Anggota sehinga Anda dapat
menampilkan nama anggota berikut dengan pembayaran yang telah dilakukan. Anda
akan menciptakan sebuah DataSet yang
memuat tabel-tabel tergabung. Aplikasi ini akan menampilkan DataSet pada sebuah kontrol DataGridView.
Langkah-Langkah Tutorial
Langkah 1: Buka program Manajer
Sekolah Karate.
Langkah 2: Tambahkan sebuah form baru pada projek dengan nama FormSemuaPembayaran.vb. Tetapkan
properti-propertinya sebagai berikut: Text
= Semua Pembayaran; MaximizeBox = False; MinimizeBox = False; StartPosition =
CenterScreen.
Langkah 3: Tambahkan sebuah kontrol MenuStrip pada form, dan ciptakan submenu File dengan satu item: Tutup.
Pada handler Click dari item Tutup, sisipkan statemen Me.Close().
Langkah 4: Pada FormUtama,
klik ganda pada item menu Pembayaran |
Semua dan sisipkan kode di dalam event handlernya:
FormSemuaPembayaran.ShowDialog()
Gambar 4.57a Jendela Query
Builder untuk memeriksa query
Langkah 5: Selanjutnya, Anda akan menciptakan sebuah TableAdapter yang menggabungkan tabel Anggota dan tabel Pembayaran. TableAdapter
ini akan diasosiasikan dengan sebuah DataTable
dengan nama Pembayaran. Buka file KarateDataSet.xsd dari jendela Solution Explorer. Klik kanan pada area terbuka dari jendela designer, pilih
Add, dan kemudian pilih TableAdapter. Ketika TableAdapter Configuration Wizard
ditampilkan, pertahankan koneksi yang sama, dan klik tombol Next dua kali. Ketika Anda melihat
langkah dengan judul Specify a SQL
Select Statemen, sisipkan query SQL berikut:
SELECT Pembayaran.ID,
Anggota.Nama_Belakang + ', ' + Anggota.Nama_Depan AS NamaLengkap,
Pembayaran.Tanggal_Pembayaran, Pembayaran.Jumlah
FROM Anggota INNER JOIN Pembayaran
ON
Anggota.ID = Pembayaran.Id_Anggota
ORDER BY Nama_Belakang
Query ini
menggabungkan tabel Anggota dan tabel Pembayaran, menggunakan nilai ID bersama
yang ditemukan pada Anggota.ID dan Pembayaran.Id_Anggota. Selain itu,
query ini juga menggabungkan nama depan dan nama belakang, menggunakan ekspresi
berikut:
Anggota.Nama_Belakang + ', ' + Anggota.Nama_Depan
AS NamaLengkap
Anda bisa
menggunakan dialog Query Builder, seperti ditunjukkan berikut:
Langkah 6: Klik pada tombol Query
Builder ,dan pada jendela yang
ditampilkan, klik pada tombol Execute
Query. Jika ada error, periksa
pengejaan dan sintaksis query. Klik tombol OK
untuk menutup jendela Query Builder.
Langkah 7: Klik pada tombol Advanced
Options. Pada jendela dialog, yang
ditunjukkan pada Gambar 4.57b, dan batalkan centang pada opsi Generate Insert, Update, and Delete
statements. Anda melakukan ini karena umumnya Anda tidak melakukan pembaruan
tabel ketika Anda menggabungkan dua tabel. Klik tombol OK.
Gambar 4.57b Jendela Advanced
Options
Langkah 8: Klik tombol Next.
Pada langkah Choose Methods to Generate,
pilih hanya opsi Fill a DataTable
dan namai metode dengan SemuaPembayaran.
Selain itu, batalkan centang kotak periksa ketiga karena Anda tidak ingin
menciptakan metode-metode yang mengirim pembaruan ke database secara langsung.
Klik tombol Finish untuk menutup
wizard. Setelah Anda selesai menambahkan query, PembayaranTableAdapter akan ditampilkan seperti ditunjukkan pada
Gambar 4.58.
Gambar 4.58 PembayaranTableAdapter, yang memuat metode SemuaPembayaran
Langkah 9: Tempatkan sebuah kontrol DataGridView pada form dan namai dengan dgvPembayaran. Tetapkan properti-properitnya sebagai berikut: BackGroundColor = Control; BorderStyle =
None; Dock = Fill, RowHeadersVisible = False.
Langkah 10: Klik pada smart tag dari dgvPembayaran untuk membuka jendela DataGridView. Untuk sumber data, pilih tabel Pembayaran pada KarateDataSet.
Batalkan centang pada kotak periksa untuk penambahan, pengeditan, dan
penghapusan.
Langkah 11: Simpan projek dan jalankan aplikasi. Tampilkan jendela Semua Pembayaran. Contoh keluaran ditampilkan pada Gambar 4.59.
Langkah 12: Tutup aplikasi.
Gambar 4.59 Form Semua Pembayaran
Tutorial 4.11: Manajer Sekolah Karate: Menampilkan
Pembayaran Per Anggota
Dalam
tutorial ini, Anda akan menciptakan sebuah form yang menampilkan sejarah
pembayaran per anggota. Sebuah kontrol ComboBox
akan merepresentasikan suatu list yang memuat nama-nama depan dan nama-nama
belakang. Ketika user menyeleksi sebuah nama, kontrol DataGridView akan mengisi pembayaran oleh anggota.
Langkah-Langkah Tutorial
Langkah 1: Buka program Manajer Sekolah Karate.
Langkah 2: Tambahkan sebuah form baru pada projek dengan nama FormPembayaranAnggota.vb. Tetapkan
properti-propertinya sebagai berikut: Text
= Pembayaran Oleh Satu Anggota. MaximizeBox = False; MinimizeBox = False;
StartPosition = CenterScreen.
Langkah 3: Tambahkan sebuah kontrol MenuStrip pada form, dan ciptakan sebuah submenu File dengan satu seleksi: Tutup. Pada handler Click dari Tutup, sisipkan statemen Me.Close().
Langkah 4: Pada form FormUtama,
klik ganda pada item menu Pembayaran |
Satu Anggota dan sisipkan kode berikut pada event handlernya:
FormPembayaranAnggota.ShowDialog()
Langkah 5: Selanjutnya, Anda akan menciptakan sebuah TableAdapter yang menampilkan nama-nama
anggota. Buka file KarateDataSet.xsd
dari jendela Solution Explorer. Klik kanan pada area terbuka
pada jendela designer, pilih Add,
kemudian pilih TableAdapter. Ketika TableAdapter Configuration Wizard
ditampilkan, pertahankan koneksi yang sama, dan klik tombol Next dua kali. Ketika Anda melihat
langkah dengan judul Specify an SQL
Select Statemen, sisipkan query SQL berikut:
Langkah 6: Klik tombol Query
Builder, dan pada jendela Query Builder, klik tombol Execute
Query. Jika pesan error ditampilkan,
periksa ejaan dan sintaksisnya. Klik tombol OK untuk menutup jendela Query Builder.
Langkah 7: Buka jendela Advanced
Options dan batalkan centang pada
opsi Generate Insert, Update, and Delete
statements. Klik tombol OK untuk menutup jendela.
Langkah 8: Klik tombol Next.
Pada langkah Choose Methods to Generate,
batalkan centang pada kotak periksa ketiga karena Anda tidak ingin menciptakan
metode-metode untuk mengirim pembaruan secara langsung ke database. Klik tombol
Finish untuk menutup wizard.
Langkah 9: Ganti nama tabel dan TableAdapter seperti ditunjukkan pada Gambar 4.60. Anda
menggantinya dengan mengklik kanan batang abu-abu dan pilih Rename dari menu yang ditampilkan.
Gambar 4.60 DataTable
NamaAnggota dan TableAdapter-nya
Serangkaian
langkah berikutnya adalah mengikat sebuah kontrol ComboBox pada tabel NamaAnggota.
Ketika user menyeleksi sebuah nama anggota, Anda ingin ID anggota tersebut
diberikan pada properti SelectedValue
dari ComboBox.
Langkah 10:
Tambahkan sebuah kontrol ComboBox
pada form dan namai dengan cboNamaAnggota.
Langkah 11: Buka jendela ComboBox
Tasks. Pilih opsi Use data bound items. Tetapkan properti
DataSource menjadi tabel NamaAnggota pada KarakterDataSet. Tetapkan properti DisplayMember menjadi Nama.
Tetapkan properti ValueMember
menjadi ID. Jika Anda menjalankan
program sekarang, Anda hanya akan melihat sebuah list yang memuat nama-nama
depan dan nama-nama belakang pada ComboBox
ini. Anda perlu menambahkan sebuah grid pada form dan menggunakannya untuk
menampilkan pembayaran-pembayaran yang dilakukan oleh anggota terseleksi di
dalam ComboBox.
Langkah 12: Pertama, Anda akan menciptakan sebuah query yang
menyeleksi anggota berdasarkan nomor ID. Buka file KarateDataSet.xsd dari jendela Solution
Explorer. Klik kanan pada PembayaranTableAdapter, pilih Add, dan kemudian pilih Query. Pada langkah Specify a SQL Select Statemen, sisipkan
query SQL berikut:
SELECT Pembayaran.ID,
Anggota.Nama_Depan + ' ' + Anggota.Nama_Belakang AS NamaLengkap,
Pembayaran.Tanggal_Pembayaran, Pembayaran.Jumlah
FROM Anggota INNER JOIN
Pembayaran
ON Anggota.ID = Pembayaran.Id_Anggota
WHERE (Id_Anggota = @IdAnggota)
ORDER BY Tanggal_Pembayaran
Langkah 13: Klik tombol Query
Builder, dan pada jendela Query Builder, klik tombol Execute
Query. Jika pesan error ditampilkan,
periksa ejaan dan sintaksisnya. Klik tombol OK untuk menutup jendela Query Builder.
Langkah 14: Klik tombol Next.
Pada langkah Choose Methods to Generate,
pilih hanya opsi Fill a Data Table
dan namai metode dengan PembayaranAnggota.
Klik tombol Finish, yang akan
menutup wizard. Anda akan melihat sebuah versi baru dari PembayaranTableAdapter di dalam DataSet pada jendela designer, seperti ditunjukkan pada Gambar 4.61.
Gambar 4.61 PembayaranTableAdapter yang telah direvisi
Langkah 15: Tambahkan sebuah kontrol Label pada FormPembayaranAnggota
tepat di atas kontrol ComboBox dan
tetapkan properti Text-nya menjadi Pilih Satu Anggota:. Tambahkan
kontrol Label kedua di bawah ComboBox dan tetapkan properti Text-nya menjadi Sejarah Pembayaran.
Selanjutnya, Anda akan menambahkan sebuah grid pada form, dan menuliskan kode
event handler SelectedIndexChanged
dari ComboBox yang mengisi grid
dengan pembayaran-pembayaran yang dilakukan oleh anggota terseleksi.
Langkah 16: Tempatkan sebuah kontrol DataGridView pada form dan namai dengan dgvPembayaran. Tetapkan properti-propertinya berikut: BackGroundColor = Control; BorderStyle =
None; Anchor = Top, Bottom, Left, Right; RowHeadersVisible = False.
Langkah 17: Buka jendela DataGridView
Tasks dengan mengklik smart tag. Tetapkan sumber data menjadi
tabel Pembayaran pada KarateDataSet. Batalkan centang pada
kotak perisak penambahan, pengeditan, dan penghapusan.
Langkah 18: Klik ganda pada ComboBox
dan sisipkan kode berikut di dalam event handler SelectedIndexChanged-nya:
Private Sub
cblNamaAnggota_SelectedIndexChanged(…)
Handles
cboNamaAnggota.SelectedIndexChanged
If
cboNamaAnggota.SelectedIndex = -1 Then Exit Sub
'Membaca nilai Id_Anggota yang berkaitan dengan anggota terseleksi
Dim
IDAnggota As Short = CShort(cboNamaAnggota.SelectedValue)
'mengisi grid pembayaran, melewatkan kepadanya ID anggota
PembayaranTableAdapter.PembayaranAnggota(KarateDataSet.Pembayaran,
IDAnggota)
End Sub
Langkah 19: Modifikasi event handler Form_Load sehingga menjadi berikut:
Private Sub
cblNamaAnggota_SelectedIndexChanged(…)
Handles
cboNamaAnggota.SelectedIndexChanged
If cboNamaAnggota.SelectedIndex = -1 Then
Exit Sub
'Membaca nilai Id_Anggota yang berkaitan
dengan anggota terseleksi
Dim
IDAnggota As Short = CShort(cboNamaAnggota.SelectedValue)
'mengisi
grid pembayaran, melewatkan kepadanya ID anggota
PembayaranTableAdapter.PembayaranAnggota(KarateDataSet.Pembayaran,
IDAnggota)
End Sub
Langkah 20: Simpan projek dan jalankan aplikasi. Pilih item menu Pembayaran | Satu Anggota. Keluaran
program ditampilkan seperti pada Gambar 4.61.
Gambar 4.62 Menampilkan setiap pembayaran oleh tiap
anggota
No comments:
Post a Comment