Sistem Pengurusan Kategori Rumah Sukan Hijau

5. Pada bahagian Insert, pilih Forms.
6. Klik pada Form, dan satu form akan terhasil (kotak berwarna merah).

[Date]

7. Pilih Common, dan pilih Table.
8. Masukkan Rows : 4 dan Columns : 2. Klik OK.

9. Jadual sudah terbina di dalam forms.

[Date]

10. Pada bahagian Properties di bawah, tukarkan Align kepada Center.
11. Select kedua-dua cell pada baris atas sekali.

12. Merge Cell dan tukarkan Horz kepada Center.

13. Select kedua-dua cell pada baris keempat.
14. Buat seperti langkah 12.
15. Klik cell kedua pada baris kedua.

[Date]

16. Pilih Text Field dibawah Forms.
17. Masukkan ID: idpengguna. Klik OK.

18. Paparan seperti dibawah akan terhasil.
19. Klik pula pada cell kedua baris ketiga.

[Date]

20.Klik semula Text Field dibawah Forms.
21. Masukkan ID: katalaluan. Klik OK.

22. Paparan seperti dibawah akan terhasil.
23. Sekarang kita akan mengubahsuai size cell pada sebelah kiri. Klik dan tarik ke

kanan garisan tengah untuk mengimbangkan saiz kedua-dua cell.

[Date]

24. Hasil seperti dibawah akan kelihatan.
25. Select kedua-dua cell yang mengandungi Text Field.
26. Tukarkan Horz kepada Left.
27. Masukkan ID Pengguna dan Katalaluan seperti gambar di bawah.
28. Select kedua-dua cell ID Pengguna dan Katalaluan.

[Date]

29. Tukarkan Horz kepada Right.
30.Masukkan Sila Log Masuk pada cell pertama.
31. Klik cell pada baris keempat.
32. Skroll Button dibawah Forms. Klik Button.

[Date]

33. Masukkan ID sebagai logmasuk. Klik OK.
34. Tukarkan value kepada LOG MASUK.
35. Klik kotak Text Field katalaluan.

[Date]

36. Tukarkan Type kepada Password.
37. Pastikan Remote Server, connected.
38. Pergi ke Server Behaviors, pilih User Authentication → Log In User.

[Date]

39. Tukarkan Username field dan Password field mengikut tetapan seperti yang
dinamakan pada Text Field untuk ID Pengguna dan Katalaluan.
Pilih table admin untuk membaca maklumat penyelaras yang berdaftar, dan
masukkan Username column dan Password column seperti di dalam
pangkalan data.
Pilih If login succeeds, go to: home.php. (jika log masuk berjaya).
If fails, go to: index.php. (jika log masuk gagal).
Pilih Restrict access based on: Username and password.
Klik OK.

40. Klik di tepi table dan tekan enter untuk memberi ruang pada bahagian atas.

[Date]

41. Klik pada Sila Log Masuk dan di bahagian Properties, anda boleh mengubah
warna table mengikut kesesuaian anda.

42. Klik di tepi kanan table dan tekan enter dua kali untuk memberi ruang di
bahagian bawah.
Taipkan ‘Belum berdaftar? Sila daftar di sini.’ Untuk membolehkan pengguna
yang belum berdaftar untuk mendaftarkan diri.

[Date]

43. Select perkataan sini, dan di bahagian Link taipkan daftaradmin.php.

11 BORANG DAFTAR MASUK

1. Kita akan membuat borang daftar masuk bagi admin atau guru penyelaras.
2. Buka home.php. Pada File → Save As...

3. Save fail sebagai daftaradmin.php. Klik Save.

[Date]

4. Pada fail daftaradmin.php, klik pada menu navigation dan tekan delete.
5. Select semua perkataan pada content dan tekan delete. Klik pada container di

sebelah header, iaitu di luar kotak yang berwarna kelabu.

6. Pergi ke Insert → Forms → Form.

[Date]

7. Pergi ke Insert → Common → Table. Masukkan Rows : 1 dan Column : 1. Klik
OK.

[Date]

8. Gantikan Align kepada Center di bahagian Properties.
9. Taipkan ‘Sila Daftar!!’ di dalam cell.

[Date]

10. Pergi ke menu Insert → Data Objects → Insert Record → Record Insertion
Form Wizard.

11. Pilih Connection: connect, Table: admin. Masukkan After inserting, go to:
daftaradmin.php.
Klik idadmin dan pada bahagian Display as pilih Hidden field.

[Date]

12. Klik namaadmin dan tukarkan Label: Nama.
Klik pada nokpadmin dan tukarkan Label: No Kad Pengenalan. Klik OK.

13. Paparan seperti gambar dibawah akan kelihatan.

[Date]

Select kedua-dua cell pada bahagian button.

Merge Cell, klik semula pada cell button dan tukarkan Horz kepada Center.
14. Klik button Insert record, dan gantikan Value kepada DAFTAR MASUK.

[Date]

15. Kita akan mengubah Text Field kepada Spry Validation Text Field supaya kita
boleh membuat peringatan kepada pengguna.
Klik pada Text Field Nama dan klik Spry Validation Text Field dibawah Forms.

Klik pada <span#sprytextfield1>, tukarkan nama Spry TextField kepada
namaadmin. Pilih Required pada Preview states.

Tukarkan ‘A value is required.’ Kepada ‘Masukkan nama anda.’.

Pilih tab Code.

[Date]

Pada kod di baris 132 bagi id namaadmin, tambahkan kod ini selepas
size=”32”.
placeholder=”Cth: Ismail Hussin”.

16. Pilih semula tab Design.
Klik pada Text Field No Kad Pengenalan dan klik Spry Validation Text Field.

Tukarkan nama Spry TextField kepada nokpadmin dan pilih Required pada
Preview states.

[Date]

Tukarkan ‘A value is required’ kepada ‘Masukkan 12 digit no kad pengenalan’.

Klik pada kotak biru Spry TextField: nokpadmin untuk kembali ke Properties
Spry TextField. Masukkan no 12 pada Min chars dan tekan enter.

Tukarkan ‘Minimum number of characters not met’ kepada ‘Masukkan 12 digit
no kad pengenalan tanpa –‘.

Klik semula pada kotak biru Spry TextField: nokpadmin. Masukkan no 12 pada
Max chars dan tekan enter.

Tukarkan ‘Exceeded maximum number of characters’ kepada ‘Masukkan no
kad pengenalan tanpa –‘.

[Date]

Pilih Code.

Pada baris ke 138 bagi id nokpadmin, tambahkan kod berikut selepas
size=”32”.
placeholder=”Cth : 901111125251”.

17. Pilih semula tab Design.
Klik pada Text Field Katalaluan dan klik Spry Validation Password.

[Date]

Masukkan ID: katalaluan dan klik OK.

Buang kotak Text Field di sebelah kotak Spry Password.
Klik pada <span#sprypassword1>. Namakan Spry Password kepada katalaluan.
Tick Required. Pilih Required pada Preview states.
Gantikan ‘A value is required’ kepada ‘Masukkan katalaluan’.

[Date]

Klik pada kotak biru Spry Password: katalaluan. Masukkan no 6 pada Min chars
dan tekan enter.

Gantikan ‘Minimum number of characters not met’ kepada ‘Minimum 6 aksara’.

Klik semula pada kotak biru Spry Password: katalaluan. Masukkan no 15
(mengikut kepada tetapan panjang jenis data bagi katalaluan dalam
pangkalan data) pada Max chars dan tekan enter.

Gantikan ‘Exceeded maximum number of characters’ kepada ‘Maksimum
katalaluan 15 aksara’.

[Date]

18. Klik pada button DAFTAR MASUK. Kemudian pada Tag Inspector, pilih tab
Behaviors, klik simbol + dan pilih Popup Message.

Masukkan Popup Message yang bersesuaian dan klik OK.

19. Taipkan ‘Log Masuk di sini’ di bawah borang daftar masuk.

[Date]

20. Select perkataan ‘sini’. Pada bahagian Link masukkan index.php.
21. Jangan lupa untuk Save.

[Date]

12 RESTRICT ACCESS TO PAGE

1. Fungsi Restrict Access To Page adalah untuk membuat sekatan kepada
pengguna yang tidak log masuk ke sistem terlebih dahulu.

2. Buka home.php.

Pada bahagian Server Behaviors, klik simbol +, pilih User Authentication →
Restrict Access To Page.

3. Pilih Restrict based on: Username and password. Masukkan index.php pada If
access denied, go to: . Klik OK.

[Date]

13 LOG KELUAR

1. Kita akan membuat fail baru. Pergi ke File → New...
2. Pilih Blank Page → PHP → <none> dan klik Create.

3. File → Save As fail kepada logout.php. Klik Save.

[Date]

4. Pada Server Behaviors, pilih User Authentication → Log Out User.
Pilih When done, go to: index.php. Klik OK.

[Date]

14 BORANG DAFTAR KATEGORI

1. Kita akan menghasilkan borang bagi mendaftar kategori terlebih dahulu.
2. Buka fail home.php. File → Save As sebagai daftarkategori.php. Klik Save.

3. Paparan seperti di bawah akan terhasil, beri ruang di bahagian bawah untuk
kita menambah borang.

[Date]

4. Pergi ke tab Insert → Data Objects → Insert Record → Record Insertion Form
Wizard.

5. Pilih Connection: connect, Table: kategori, After inserting, go to:
daftarkategori.php. Pada Form fields, klik idkategori dan ubah Label. Klik OK.

[Date]

6. Paparan seperti dibawah akan terhasil.

7. Select kedua-dua cell pada baris bahagian button. Pilih Merge Cell.
Klik semula pada cell button, dan tukarkan Horz ke Center.

[Date]

8. Klik button Insert record dan pada bahagian Properties gantikan Value ke
DAFTAR.

9. Pergi ke tab Tag Inspector di sebelah kanan. Pilih Behaviors, klik simbol + dan
pilih Popup Message.

Masukkan Popup Message. Klik OK.

[Date]

10. Selesai untuk borang daftar kategori.

15 BORANG DAFTAR PELAJAR

1. Kita akan menghasilkan borang bagi tujuan mendapatkan maklumat pelajar
iaitu borang daftar pelajar.

2. Buka fail home.php. File → Save as sebagai daftarpelajar.php. Klik Save.

[Date]

3. Ubahsuai mengikut keperluan, tekan enter untuk memberi ruang di bahagian
bawah.

4. Kita akan membuat Recordset terlebih dahulu. Pilih Bindings, klik simbol + dan
pilih Recordset (Query).

[Date]

Namakan Recordset sebagai kategori, pilih Connection: connect, Table:
kategori dan klik OK.

Recordset untuk kategori sudah terhasil.
5. Kita akan membuat lagi Recordset. Pilih Bindings, klik simbol + dan pilih

Recordset (Query).

[Date]

Klik Advanced...
Paparan pada bahagian Advanced Recordset seperti dibawah.

[Date]

6. Namakan Recordset sebagai daftar, pilih Connection: connect. Kita akan
menggunakan penyataan SQL kerana melibatkan dua jadual (table) dalam
pangkalan data.
Pada bahagian Database items, klik pada Tables → pelajar. Klik pada
nokadpengenalan dan klik SELECT untuk memilih. Senarai SELECT akan
kelihatan di kotak SQL.

SELECT nokadpengenalan, nama, jantina dan tingkatan dari table pelajar dan
SELECT kategori dari table kategori.

[Date]

7. Untuk menghubungkan dua jadual (table), klik pada idkategori di table
kategori dan klik WHERE. Klik lagi idkategori di table pelajar dan klik WHERE.
Penyataan SQL seperti di bawah akan terhasil.

Ubah kategori.idkategori AND pelajar.idkategori kepada kategori.idkategori =
pelajar.idkategori, seperti dibawah.

Penyataan SQL penuh adalah seperti berikut.
SELECT pelajar.nokadpengenalan, pelajar.nama, pelajar.jantina,
pelajar.tingkatan, kategori.kategori
FROM pelajar, kategori
WHERE kategori.idkategori = pelajar.idkategori
Klik OK.

[Date]

Recordset daftar sudah terhasil.

8. Pergi ke Insert → Data Objects → Insert Record → Record Insertion Form
Wizard.

[Date]

9. Pilih Connection: connect, Table: pelajar, set After inserting, go to:
daftarpelajar.php. Kemaskini Label pada Form fields. Klik nokadpengenalan
dan ubah Label: No Kad Pengenalan:.

Klik pada Jantina, pilih Menu di bahagian Display as:

[Date]

Klik pada Menu Properties...
Masukkan Menu items, klik simbol + untuk menambah items. Klik OK.

10. Klik pada Tingkatan, pilih Menu untuk Display as:, dan klik Menu Properties.

[Date]

Masukkan senarai kelas di Menu items. Klik simbol + untuk menambah item.
Klik OK jika sudah selesai.

11. Klik Idkategori, pilih Menu pada Display as: dan klik Menu Properties.

[Date]

Pilih Populate menu items: From database.
Recordset: kategori.
Get labels from: kategori
Get values from: idkategori
Klik OK

Namakan Label Idkategori sebagai Kategori. Klik OK.

[Date]

12. Paparan selepas Record Insertion Form selesai.

Select kedua-dua cell pada baris button Insert record.
Merge cell, klik semula baris button Insert record dan tukar Horz kepada
Center.
13. Klik button Insert record, tukar Value kepada DAFTAR.

[Date]

14. Seterusnya, pergi ke Tag Inspector → Behaviors, klik simbol +, pilih Popup
Message.

Masukkan Popup Message. Klik OK.

15. Paparan bagi borang pendaftaran pelajar.

[Date]

16 PAPAR SENARAI PELAJAR

1. Sekarang, kita akan memaparkan data pelajar yang diambil dari pangkalan
data.

2. Buka fail home.php, File → Save As sebagai papardata.php. Klik Save.

3. Ubahsuai content mengikut kesesuaian. Tekan enter untuk memberi ruang di
bawah.

[Date]

4. Kita akan membuat Recordset terlebih dahulu. Pergi ke Bindings, klik simbol +
dan pilih Recordset (Query)

Untuk memaparkan senarai data pelajar, pastikan kita berada di Advanced
Recordset kerana paparan data ini melibatkan dua jadual (table).
SELECT nokadpengenalan, nama, jantina, tingkatan pada Tables pelajar.

[Date]

SELECT kategori pada Tables kategori.
5. Pada Tables kategori, klik idkategori dan klik WHERE.

[Date]

Pada Tables pelajar, klik idkategori dan klik WHERE.

6. Ubah penyataan SQL kategori.idkategori AND pelajar.idkategori kepada
kategori.idkategori = pelajar.idkategori.

[Date]