• Tidak ada hasil yang ditemukan

Membuat Form Daftar Member

Dalam dokumen MODUL KULIAH PEMROGRAMAN VISUAL 1 (Halaman 180-187)

Form Daftar Member menampilkan seluruh member yang

terdaftar dalam database Rental. Form ini bisa digunakan

untuk pencarian member berdasarkan criteria tertentu.

Data hasil pencarian dapat diurutkan berdasarkan kolom

tertentu dengan orientasi ascending maupun descending.

Form ini berhubungan dengan form FMember untuk

menampilkan data lengkap member beserta histori

transaksinya.

Langkah-langkah :

1. Pastikan project Rental.dpr telah dibuka. 2. Buat form baru, klik menu File – New – Form.

3. Ubah property form yang baru dibuat seperti pada table di bawah ini : Komponen Property Value

Form1 Caption Daftar Member BorderStyle bsSizeable

Name FDMember

Position poDesktopCenter WindowState wsMaximized

4. Klik menu File – Save All untuk menyimpan project. Simpan Unit1 menjadi UFDMember.pas dalam folder Rental.

5. Klik menu File – Use Unit, pilih UFUtama, klik OK untuk melanjutkan. 6. Tambahkan 2 buah ADOQuery dari tab ADO, atur property seperti table

di bawah ini :

Komponen Tab Parent Property Value

ADOQuery1 ADO FDMember Connection FUtama.ADOConnection1

Name qAwal SQL SELECT MEMBER.MEMBERID, MEMBER.NAMA, MEMBER.ALAMAT, MEMBER.KOTA, MEMBER.HANDPHONE, (SELECT COUNT(DPINJAM.DPINJAMID) FROM PINJAM, DPINJAM

WHERE (PINJAM.PINJAMID = DPINJAM.PINJAMID) AND (PINJAM.MEMBERID =

MEMBER.MEMBERID)) AS MEMINJAM, (SELECT COUNT(DPINJAM.DPINJAMID) FROM PINJAM, DPINJAM

WHERE (PINJAM.PINJAMID = DPINJAM.PINJAMID) AND (PINJAM.MEMBERID = MEMBER.MEMBERID) AND (DPINJAM.KEMBALIID <> 0)) AS MENGEMBALIKAN FROM MEMBER

WHERE

(MEMBER.NAMA LIKE :NAMA) AND (MEMBER.ALAMAT LIKE :ALAMAT) AND (MEMBER.KOTA LIKE :KOTA) AND (MEMBER.HANDPHONE LIKE :HANDPHONE)

ADOQuery2 ADO FDMember Connection FUtama.ADOConnection1

Name qSearch

SQL sama dengan qAwal, cukup copy paste dari qAwal.

7. Tambahkan 1 buah DataSource dari tab Data Access, ubah property seperti table di bawah ini :

Komponen Tab Parent Property Value Datasource1 Data Access FDMember Dataset qSearch

8. Pilih qSearch pada Object TreeView, atur property Parameters seperti pada table di bawah ini :

Komponen Property Value TParameters[0] DataType ftWideString TParameters[1] DataType ftWideString TParameters[2] DataType ftWideString TParameters[3] DataType ftWideString

9. Buat persistent field query qSearch, klik dua kali qSearch untuk membuka field editor, klik kanan dan pilih Add All Fields.

10. Tambahkan 1 buah Panel dari tab Standard ke dalam FDMember, ubah property seperti table di bawah ini :

Komponen Tab Parent Property Value Panel1 Standard FDMember Align alTop

11. Tambahkan 1 buah GroupBox dan 2 buah RadioGroup dari tab Standard ke dalam Panel1, ubah property seperti table di bawah ini :

Komponen Tab Parent Property Value GroupBox1 Standard Panel1 Align alLeft

Caption Kriteria Pencarian : RadioGroup1 Standard Panel1 Align alLeft

Caption Urut Berdasarkan : Items MemberID Nama Member Alamat Kota Handphone Pinjam Kembali RadioGroup2 Standard Panel1 Align alClient

Caption Orientasi : Items Ascending

12. Tambahkan 4 buah Label dan 4 buah Edit dari tab Standard ke dalam GroupBox1, ubah property seperti table di bawah ini :

Komponen Tab Parent Property Value

Label1 Standard GroupBox1 Caption Nama Member Label2 Standard GroupBox1 Caption Alamat Label3 Standard GroupBox1 Caption Kota Label4 Standard GroupBox1 Caption Handphone Edit1, Edit2, Edit3, Edit4 Charcase ecUpperCase Text

13. Tambahkan 2 buah BitBtn dari tab Additional ke dalam GroupBox1, atur property seperti table di bawah ini :

Komponen Tab Parent Property Value BitBtn1 Additional GroupBox1 Caption Search

Glyph Cari.bmp BitBtn2 Additional GroupBox1 Caption Reset

Glyph Reset.bmp

14. Tambahkan 1 buah GroupBox dari tab Standard ke dalam FDMember, atur property seperti table di bawah ini :

Komponen Tab Parent Property Value GroupBox2 Standard FDMember Align alClient

Caption Hasil Pencarian :

15. Tambahkan 1 buah DBGrid dari tab Data Control ke dalam GroupBox2, atur property seperti table di bawah ini :

Komponen Tab Parent Property Value

DBGrid1 Data Control GroupBox2 Align alClient

Datasource DataSource1

Options.dgRowSelect True Options.dgAlwaysShowSelection True 16. Klik dua kali DBGrid2 pada Object TreeView untuk membuka Column

Editor, klik kanan dan pilih Add All Fields, ubah property masing-masing kolom seperti table di bawah ini :

Komponen Property Value

DBGrid1.Columns[0] Title.Caption ID

DBGrid1.Columns[1] Title.Caption Nama Member DBGrid1.Columns[2] Title.Caption Alamat DBGrid1.Columns[3] Title.Caption Kota DBGrid1.Columns[4] Title.Caption Handphone DBGrid1.Columns[5] Title.Caption Pinjam DBGrid1.Columns[6] Title.Caption Kembali DBGrid1.Columns[0],

DBGrid1.Columns[1], DBGrid1.Columns[2],

Title.Alignment taCenter Title.Font.Style.fsBold True

Komponen Property Value DBGrid1.Columns[3],

DBGrid1.Columns[4], DBGrid1.Columns[5], DBGrid1.Columns[6]

17. Atur layout form FDMember seperti gambar di bawah ini :

18. Buat procedure Search dan procedure Reset pada blok Private, ketikkan perintah seperti table di bawah ini :

Komponen Event Code

FDMember Search procedure TFDMember.Search; var I : Integer; begin qSearch.Close; qSearch.SQL := qAwal.SQL; Case RadioGroup1.ItemIndex of 0 : qSearch.SQL.Add('ORDER BY 1'); 1 : qSearch.SQL.Add('ORDER BY 2'); 2 : qSearch.SQL.Add('ORDER BY 3'); 3 : qSearch.SQL.Add('ORDER BY 4'); 4 : qSearch.SQL.Add('ORDER BY 5'); 5 : qSearch.SQL.Add('ORDER BY 6'); 6 : qSearch.SQL.Add('ORDER BY 7'); End; Case RadioGroup2.ItemIndex of 0 : qSearch.SQL.Add('ASC'); 1 : qSearch.SQL.Add('DESC'); End; qSearch.Parameters[0].Value := '%' + Edit1.Text + '%'; qSearch.Parameters[1].Value := '%' + Edit2.Text + '%'; qSearch.Parameters[2].Value := '%' + Edit3.Text + '%'; qSearch.Parameters[3].Value := '%' + Edit4.Text + '%';

Komponen Event Code

For I := 0 to DBGrid1.Columns.Count - 1 do DBGrid1.Columns[I].Color := clWindow; If RadioGroup2.ItemIndex = 0 then

DBGrid1.Columns[RadioGroup1.ItemIndex].Color := clMoneyGreen Else DBGrid1.Columns[RadioGroup1.ItemIndex].Color := clSkyBlue; ActiveControl := DBGrid1;

end;

Reset procedure TFDMember.Reset; begin Edit1.Text := ''; Edit2.Text := ''; Edit3.Text := ''; Edit4.Text := ''; RadioGroup1.ItemIndex := 0; RadioGroup2.ItemIndex := 0; Search; end;

19. Pilih FDMember pada Object TreeView, buat event onShow dan onClose, ketikkan perintah seperti table di bawah ini :

Komponen Event Code

FDMember onShow procedure TFDMember.FormShow(Sender: TObject); begin

Reset; end;

onClose procedure TFDMember.FormClose(Sender: TObject; var Action: TCloseAction);

begin

qSearch.Close; end;

20. Pilih Edit1, Edit2, Edit3 dan Edit4 pada Object TreeView, buat event onKeyPress, ketikkan perintah seperti table di bawah ini :

Komponen Event Code Edit1,

Edit2, Edit3, Edit4

onKeyPress procedure TFDMember.Edit1KeyPress(Sender: TObject; var Key: Char);

begin

If Key = #13 then Search; end;

21. Pilih BitBtn1 pada Object TreeView, buat event onClick, ketikkan perintah seperti table di bawah ini :

Komponen Event Code

BitBtn1 onClick procedure TFDMember.BitBtn1Click(Sender: TObject); begin

Search; end;

22. Pilih BitBtn2 pada Object TreeView, buat event onClick, ketikkan perintah seperti table di bawah ini :

Komponen Event Code

BitBtn2 onClick procedure TFDMember.BitBtn2Click(Sender: TObject); begin

Reset; end;

23. Pilih RadioGroup1 pada Object TreeView, buat event onClick, ketikkan perintah seperti table di bawah ini :

Komponen Event Code

RadioGroup1 onClick procedure TFDMember.RadioGroup1Click(Sender: TObject); begin

If RadioGroup1.ItemIndex in [5,6] then Begin

RadioGroup2.ItemIndex := 0; RadioGroup2.Enabled := False; End Else RadioGroup2.Enabled := True; Search;

end;

24. Pilih RadioGroup2 pada Object TreeView, buat event onClick, ketikkan perintah seperti table di bawah ini :

Komponen Event Code

RadioGroup2 onClick procedure TFDMember.RadioGroup2Click(Sender: TObject); begin

Search; end;

25. Klik menu File – Use Unit, pilih FMember, klik OK untuk melanjutkan. 26. Pilih DBGrid1 pada Object TreeView, buat event onDblClick, ketikkan

perintah seperti table di bawah ini : Komponen Event Code

DBGrid1 onDblClick procedure TFDMember.DBGrid1DblClick(Sender: TObject); begin With FMember do Begin MemberID := qSearchMemberID.Value; ShowModal; End; end;

27. Kembali ke form FUtama, klik menu View – Form, pilih FUtama, klik OK untuk melanjutkan.

28. Klik menu File – Use Unit, pilih FDMember, klik OK untuk melanjutkan. 29. Pilih DaftarMember1 pada Object TreeView, buat event onClick,

Komponen Event Code

DaftarMember1 onClick procedure TFUtama.DaftarMember1Click(Sender: TObject); begin

FDMember.ShowModal; end;

30. Pilih SpeedButton5 pada Object TreeView, buat event onClick, ketikkan perintah seperti table di bawah ini :

Komponen Event Code

SpeedButton5 onClick procedure TFUtama.SpeedButton5Click(Sender: TObject); begin

FDMember.ShowModal; end;

Dalam dokumen MODUL KULIAH PEMROGRAMAN VISUAL 1 (Halaman 180-187)