Skenarionya saya memiliki database proyek yang berisi 1 tabel “proyek” dan 1 tabel “item” serta 1 tabel relasi yang saya beri nama tabel “nilai” dimana tiap proyek memiliki banyak item pekerjaan, dan saya akan membuat mengatur grid agar bila proyek di klik maka item proyek akan tampil dalam bentuk tabel drop down.
Langkah pertama buat tabel lihat pada gambar di bawah.
CREATE DATABASE proyek;
CREATE TABLE proyek ( id INTEGER PRIMARY KEY AUTOINCREMENT, proyek VARCHAR (200) );
CREATE TABLE item ( id INTEGER PRIMARY KEY AUTOINCREMENT, item VARCHAR (200) );
CREATE TABLE nilai ( id INTEGER PRIMARY KEY AUTOINCREMENT, proyek INTEGER, item INTEGER );
Skenario tabel telah selesai. Saya beralih ke pembuatan Form delphi, pada Form utama, sebelum beralih ke tahap yang lebih hebat ada baiknya saya atur tataletak dan properties komponen yang digukan agar terlihat lebih menarik. Untuk lebih jelasnya lihat pentunjuk pada tabel ini.
No | tab palette | komponen | Properties | nilai |
1. | standar | Panel | align | alLeft |
bevelOuther | bvNone | |||
caption | ||||
1.1. | standar | GroupBox | align | alTop |
caption | Proyek | |||
name | grp1 | |||
1.2. | standar | GroupBox | align | alTop |
caption | Item | |||
name | grp2 | |||
1.3. | standar | GroupBox | align | alTop |
caption | Item Proyek | |||
name | grp3 | |||
1.1.1. | standar | Edit | name | edtproyek |
1.1.2. | standar | Button | caption | simpan |
name | btnproyek | |||
1.2.1. | standar | Edit | name | edtitem |
1.2.1. | standar | Button | caption | simpan |
name | btnitem | |||
1.3.1. | standar | Label | caption | proyek |
1.3.2. | standar | Label | caption | item |
1.3.3. | standar | ComboBox | name | cbproyek |
1.3.4. | standar | ComboBox | name | cbitem |
1.3.5. | standar | Button | caption | simpan |
name | btnitemproyek | |||
2. | Zeos Access | ZConnection | Database | proyek.db |
protocol | sqlite-3 | |||
connected | True | |||
name | db1 | |||
3. | Zeos Access | ZQuery | connection | db1 |
name | zproyek | |||
SQL | kode proyek | |||
active | true | |||
4. | Zeos Access | ZQuery | connection | db1 |
name | zitem | |||
SQL | kode item | |||
active | true | |||
5. | Zeos Access | ZQuery | connection | db1 |
name | zitemproyek | |||
SQL | kode nilai | |||
active | true | |||
6. | Data Access | DataSource | DataSet | zProyek |
name | dProyek | |||
7. | Data Access | DataSource | DataSet | zItemProyek |
name | dItemProyek | |||
8. | Dev Express | cxGrid | align | alClient |
name | cxGrid1 |
untuk devExpress cxGrid akan saya skenariokan melalui gambar biar lebih dapat fahamnya, dan/atau kamu dapat sesuaikan form sesuai gambar dibawah ini. dan saya menganggap tidak ada masalah dalam penulisan script CRUD, jadi saya tidak akan membahasnya di sini. 🙂 saya cuma menskenariokan bahwa saya memiliki komponen yang dapat melakukan proses CRUD tersebut. 🙂
//kode proyek SELECT * FROM proyek
//kode item SELECT * FROM item
//kode nilai SELECT nilai.id,nilai.proyek,item.item FROM nilai INNER JOIN item ON (item.id=nilai.item)
*pengaturan databate pada Zeoz Access – ZConnection akan berbeda pada tiap DBMS. Pada Skenario saat ini saya menggunakan SQLite3.
**pada pengaturan database ZConnection untukSQLite3 kamu bisa menuliskan nama database tanpa menulis direktori database dengan syarat database berada pada direktori yang sama dengan aplikasi yang dibuat
lihat cxGrid
Pada pojok kanan bawah terdapat beberapa tombol tekan tombol costumize untuk pengaturan lanjutan cxGrig dan form costumize cxGrid akan terbuka. lihat gambar selanjutnya dan ikuti petunjuknya.
No. | komponen | properties | nilai |
1. | cxgridDBTableView | name | cxgrdbtblvw1 |
datasource | dProyek | ||
columnAutoWidth | True | ||
GroupByBox | False |
setelah datasource terhubung dengan komponen DataConnection dProyek, Tombol [Retrieve Field] akan aktif –tekan tombol tersebut. Saat ini tabel proyek pada data base telah terhubung dengan cx Grid, pada saat ini saya telah berhasil menghungkan 1 tabel dengan cxGrid dan saya akan melanjutkan menghubungkan tabel ke 2 sebagai anak dari tabel pertama, ikuti langkah berikutnya.
ikuti gambar ini pilih cxgrdlvlGrid1Level1 lalu tekan tombol Add Level, level baru akan muncul dibawah level sebelumnya. Lihat gambar berikutnya, klik kanan level baru tersebut pilih [Create View][DB Table]. dan cxgrdbtblvw2 akan terbentuk
Langkah 5 akan terlihat sama dengan langkah2, untuk pengaturan properties komponennya dapa dilihat pada tabel setelah gambar langkah 6
No. | Komponen | Properties | Nilai |
1. | cxgridDBTableView | name | cxgrdbtblvw2 |
DataSource | dItemProyek | ||
DetailKeyFieldNames | proyek | ||
KeyFieldNames | proyek | ||
Master KeyFieldNames | id | ||
columnAutoWidth | True | ||
GroupByBox | False |
Seperti pada langkah 2 setelah datasource pada cxgrdbtblvw2 terhubung dengan komponen DataConnection dItemProyek, Tombol [Retrieve Field] akan aktif