Sistem Pengurusan Kategori Rumah Sukan Hijau

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.

Recordset papar sudah terhasil.

7. Untuk memaparkan senarai data, pergi ke Insert → Data Objects → Dynamic
Data → Dynamic Table.

[Date]

Pilih Recordset papardata. Show: All records. Klik OK.

8. Jadual untuk paparan data seperti gambar dibawah. Ubah tajuk untuk setiap
cell.

9. Klik <table>, gantikan Align kepada Center.

[Date]

10. Select cell tajuk, pada bahagian Properties ubah warna pada Bg, ikut
kesesuaian.

11. Klik di tepi jadual dan tekan enter dua kali. Pilih Format → Heading 6.

12. Taip ‘Jumlah murid : ‘

[Date]

Pergi ke Server Behaviors, klik simbol + dan pilih Display Record Count →
Display Total Records.

Pilih Recordset: papardata. Klik OK.

13. Paparan untuk senarai pelajar sudah siap.

[Date]

17 KEMASKINI (UPDATE) DAN HAPUS (DELETE)

1. Kita akan membuat borang kemaskini dan fungsi hapus untuk mengubahsuai
maklumat pelajar.

2. Pada fail papardata.php, File → Save As sebagai updatedelete.php. Klik Save.

3. Klik pada cell KATEGORI.

Pilih Insert → Layout → Insert Column to the Right (klik dua kali).

[Date]

4. Namakan KEMASKINI dan juga HAPUS untuk column yang baru ditambah.
5. Sekarang kita akan membuat fail baru untuk kemaskini. Buka fail home.php.

File → Save As sebagai update.php. Klik Save.

6. Ubahsuai content mengikut kesesuaian. Tekan enter untuk ruang dibawah.

[Date]

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

Klik Simple...

Namakan Recordset sebagai kategori. Pilih Connection: connect, Table:
kategori. Klik OK.

[Date]

8. Buat Recordset sekali lagi, pergi ke Bindings, klik simbol + dan pilih Recordset
(Query).

Namakan Recordset sebagai pelajar. Pilih Conncetion: connect, Table: pelajar.
Kemudian pada bahagian Filter, pilih nokadpengenalan, pilih URL Parameter
dan masukkan nokadpengenalan.
Klik Advanced...

[Date]

Pada bahagian Advanced Recordset, SELECT nokadpengenalan, nama,
jantina, tingkatan, idkategori di Tables pelajar dan SELECT kategori di Tables
kategori.

Klik idkategori di Tables kategori dan klik WHERE.

[Date]

Klik idkategori di Tables pelajar dan klik WHERE. Penyataan SQL seperti
gambar di bawah akan terhasil.

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

Berikut merupakan penyataan SQL yang penuh:
SELECT pelajar.nokadpengenalan, pelajar.nama, pelajar.jantina,
pelajar.tingkatan, pelajar.idkategori, kategori.kategori,
FROM pelajar, kategori
WHERE pelajar.nokadpengenalan = colname AND kategori.idkategori =
pelajar.idkategori
Klik OK.

[Date]

9. Pergi ke Insert → Data Objects → Update Record → Record Update Form
Wizard.

Pilih Connection: connect, Table to update: pelajar, Select record from: pelajar,
Unique key column: nokadpengenalan.
After updating, go to: updatedelete.php.
Tukar Label di bahagian Form fields.

[Date]

10. Klik Jantina, pilih Display as: Menu dan klik Menu Properties.

Masukkan items bagi jantina. Klik simbol + untuk menambah item. Klik OK jika
selesai.

[Date]

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

Masukkan item untuk Tingkatan. Klik simbol + untuk menambah item. Klik OK
jika selesai.

[Date]

12. Klik pada idkategori, namakan Label: Kategori:, pilih Display as: Menu dan klik
Menu Properties...

Pilih Populate menu items: From database, Recordset: kategori, Get labels
from: kategori, Get values from: idkategori.
Pastikan pada bahagian Select value equal to: <?php
htmlentities($row_pelajar['idkategori'], ENT_COMPAT, 'utf-8') ?>
Klik OK.

[Date]

Klik OK.
13. Paparan untuk borang kemaskini seperti gambar dibawah.

14. Select cell seperti gambar di bawah.

[Date]

Tukarkan Horz kepada Left.
15. Select kedua-dua cel pada baris button Update record.

Klik Merge cell, klik semula cell button, dan tukarkan Horz kepada Center.
16. Klik button Update record dan tukarkan Value kepada KEMASKINI.

[Date]

17. Pergi ke Tag Inspector → Behaviors, klik simbol + dan pilih Popup Message.

Masukkan Popup Message dan klik OK.

18. Kembali ke fail updatedelete.php.
Select perkataan KEMASKINI.

[Date]

Klik ikon folder pada Link.
Masukkan File name: update.php. Klik pada Parameters.
Masukkan nokadpengenalan pada name, dan klik pada Value.

[Date]

Pada Field, pilih Recordset (papardata), dan klik nokadpengenalan. Klik OK.
Klik OK.
Klik OK.

[Date]

19. Sekarang kita akan membuat fail untuk delete. Pergi File → New...
Pilih Blank Page → PHP → <none>, klik Create.

20. Pergi File → Save As... . Save sebagai delete.php. Klik Save.

[Date]

21. Kita akan membuat Recordset terlebih dahulu, pergi ke Bindings, klik simbol +,
pilih Recordset (Query).

Klik pada Simple...

Namakan Recordset sebagai delete. Pilih Connection: connect, Table: pelajar.
Pada bahagian Filter, pilih nokadpengenalan = URL Parameter
nokadpengenalan.
Klik OK.

[Date]

Recordset delete sudah dihasilkan.

22. Pergi ke Server Behaviors, klik simbol + dan pilih Delete Record.

Pilih First check if variable is defined: URL Parameter nokadpengenalan
Connection: connect, Table: pelajar, Primary key column: nokadpengenalan
Primary key value: URL Parameter nokadpengenalan
After deleting, go to: updatedelete.php.
Klik OK.

[Date]

23. Kembali atau buka semula fail updatedelete.php.
Select perkataan HAPUS.
Klik ikon folder pada bahagian Link.

24. Masukkan File name: delete.php dan klik Parameters...

25. Masukkan nokadpengenalan pada Name dan klik Value.

[Date]

Pada Field, pilih Recordset (papardata) dan klik nokadpengenalan. Klik OK.

Klik OK.
Klik OK.

[Date]

26. Selesai.

18 CARIAN, LAPORAN DAN FUNGSI CETAK

1. Kita akan membuat borang carian pelajar mengikut kategori.
2. Buka fail home.php. Pergi ke File → Save As... .

Save sebagai searchkategori.php.

[Date]

3. Pastikan terdapat ruang dibahagian bawah.

4. Pilih Insert → Forms → Form
Form akan terhasil. (garisan berwarna merah)

5. Pergi Insert → Common → Table

[Date]

Masukkan Rows: 2 dan Columns: 2. Klik OK.

6. Klik pada cell kedua di baris pertama.
Pergi ke Insert → Forms → Select (List/Menu)

[Date]

Masukkan ID sebagai searchkategori. Klik OK.

7. Klik cell kedua pada baris bawah.
Pilih Insert → Forms → Button

[Date]

Masukkan ID sebagai paparkategori. Klik OK.
8. Select kedua-dua cell seperti dalam gambar.

Pada bahagian Properties, gantikan Horz kepada Left.

[Date]

9. Ubahsuai besar cell. Select kedua-dua cell pada baris button.
Pilih Merge Cell, klik lagi sekali cell button dan gantikan Horz kepada Center.

10. Klik button Submit, gantikan Value kepada PAPAR.

11. Masukkan Kategori : pada cell pertama di baris pertama.

[Date]

Gantikan Horz kepada Right.

12. Klik <form#form1>, masukkan pada bahagian Action : laporan.php, kemudian
pilih Method : GET.

13. Kita akan membuat Recordset. Pada Bindings, klik simbol + dan pilih
Recordset (Query).

[Date]

Namakan Recordset sebagai kategori, Connection: connect, Table: kategori.
Klik OK.

Recordset kategori sudah dihasilkan.
14. Buat Recordset lagi, pilih Bindings, klik simbol + dan pilih Recordset (Query).

[Date]

Klik Advanced...

Namakan Recordset sebagai papar, Connection: connect. Kita akan
menggunakan penyataan SQL. Sebelum itu, kita akan membuat satu Variables.
Klik pada simbol +.

Namakan variable sebagai colname, Type: Text, Default value: -1, Runtime
value : $_GET[‘searchkategori’]

[Date]

15. Pada bahagian Database items, SELECT nokadpengenalan, nama, jantina,
tingkatan pada Tables pelajar, dan SELECT kategori pada Tables kategori.

Ubah penyataan SQL kepada berikut:

Penyataan SQL penuh seperti berikut:
SELECT pelajar.nokadpengenalan, pelajar.nama, pelajar.jantina,
pelajar.tingkatan, pelajar.idkategori, kategori.kategori
FROM pelajar INNER JOIN kategori ON kategori.idkategori =
pelajar.idkategori
WHERE pelajar.idkategori LIKE colname
Klik OK.

[Date]

16. Klik pada kotak menu dan pada bahagian Properties, klik Dynamic...
17. Pilih Options from recordset: kategori, Values: idkategori, Labels: kategori. Klik

OK.

18. Kembali atau buka fail searchkategori.php.

[Date]

Pilih File → Save As...

File name: laporan.php. Klik Save.
19. Klik cell pada button PAPAR, klik <table> dan tekan delete.
20. Klik pada footer dan tekan delete. Klik pada menu navigation dan klik delete.

[Date]

Klik pada header dan tekan delete.

Paparan hanya akan tinggal content sahaja seperti gambar di bawah.

21. Ubahsuai content, tambah tajuk seperti di bawah. Kita akan menambah untuk
memaparkan jenis kategori mengikut kategori pada carian.
Kita akan membuat drag and drop daripada kategori di recordset masuk ke
bahagian tajuk.

[Date]

22. Kita akan meletakkan logo pada bahagian atas sekali. Kita akan melakukan
cara drag and drop juga.

Masukkan nama logo atau biarkan kosong. Klik OK.

[Date]

Imej atau logo yang berjaya dimasukkan.

23. Pada bahagian Properties, gantikan nilai W dan H untuk mengecilkan saiz
logo.
W: 250 dan H: 160

[Date]

24. Kita akan memasukkan hasil carian.
Pilih Insert → Data Objects → Dynamic Data → Dynamic Table

[Date]

Pilih Recordset: papar, Show: All records. Klik OK.
Jadual untuk hasil carian seperti dalam gambar.
25. Klik pada <table>, gantikan Align kepada Center.

[Date]

26. Pada Server Behaviors, klik simbol +, pilih Show Region → Show If Recordset
Is Not Empty.

Pilih Recordset: papar. Klik OK.

27. Pergi ke bahagian bawah table, ubah Format: Heading 6 untuk memilih saiz
tulisan kecil.

[Date]

28. Taipkan ‘Jumlah rekod : ‘. Kemudian pada Server Behaviors, klik simbol +, pilih
Display Record Count → Display Total Records.

Pilih Recordset: papar. Klik OK.

29. Tambah ‘ | Kembali | Cetak’.
Select perkataan ‘Kembali’.

[Date]

Masukkan pada Link : searchkategori.php
30. Select perkataan ‘Cetak’.

Masukkan pada Link : javascript:window.print()
31. Save fail.

19 IMPORT FAIL

1. Buka fail home.php. Pilih File → Save As...

File name: import.php. Klik Save.

[Date]

2. Pilih tab Code.

Pergi ke baris 61 dan tekan enter untuk ke baris 62, dan masukkan kod seperti
berikut:

Kod penuh:
<form method="post" enctype="multipart/form-data">

<div align="center">
<label>Pilih fail CSV:</label>

<input type="file" name="file" />
<br />
<input type="submit" name="submit" value="IMPORT" class="btn btn-info" />

</div>
</form>
3. Kemudian pergi ke baris 44, tekan enter untuk ke baris 45.

[Date]

Masukkan kod berikut:

Berikut merupakan kod penuh:

$connect = mysqli_connect("localhost", "root", "", "sistempengurusan");
if(isset($_POST["submit"]))
{
if($_FILES['file']['name'])
{

$filename = explode(".", $_FILES['file']['name']);
if($filename[1] == 'csv')
{
$handle = fopen($_FILES['file']['tmp_name'], "r");
fgetcsv($handle);
while($data = fgetcsv($handle))
{

$query = "INSERT into pelajar(nokadpengenalan, nama, jantina, tingkatan,
idkategori) values('$data[0]','$data[1]','$data[2]','$data[3]','$data[4]')";

mysqli_query($connect, $query);
}
fclose($handle);
echo "<script>alert('Data berjaya diimport!');</script>";
}
}
}

4. Pilih tab Design.

[Date]

5. Save fail import.php.
6. Untuk membuat fail CSV, buka Microsoft Excel.

7. Susunan data perlu mengikut susunan medan pada jadual pelajar di pangkalan
data.

Save As di folder sistempengurusan.

[Date]

Save sebagai importdata. Pastikan untuk memilih jenis CSV (Comma
delimited) (*.csv). Klik Save.

20 MENGUBAH SAIZ TULISAN

1. Untuk mengubah saiz tulisan (font), kita akan menambah sedikit kod pada fail
header.php.

2. Oleh itu, buka fail header.php. Pilih tab Code.

3. Tambah kod berikut di bawah <div class=”header”>

[Date]

Berikut merupakan kod penuh untuk mengubah size tulisan.

<font size="2"><b>&nbsp; Font :</b></font>
<span onclick="resizeText(-1)"><font size="2">A-</font></span>
<span onclick="resizeText(1)"><font size="3">A+</font></span>
<script type="text/javascript">
function resizeText(multiplier) {

if (document.body.style.fontSize == "") {
document.body.style.fontSize = "1.0em";

}
document.body.style.fontSize = parseFloat(document.body.style.fontSize) +
(multiplier * 0.2) + "em";
}
</script>

4. Berikut merupakan paparan hasil dari kod mengubah saiz tulisan.

[Date]

21 CAPAIAN SISTEM

1. Untuk mengakses sistem yang telah kita bangunkan, buka browser (contoh :
google chrome atau firefox).

2. Taipkan pada url localhost/sistempengurusan.

Tahniah, anda telah berjaya membina sebuah Sistem Pengurusan Kategori
Rumah Sukan Hijau.

[Date]