Mudahnya Menambahkan Icon di Judul Kolom Tabel pada Halaman List dari PHPMaker

Pernahkah Anda mengalami kesulitan ketika ingin menambahkan icon pada judul kolom tabel yang terdapat di halaman List pada Aplikasi Web yang dihasilkan oleh PHPMaker? Jika ya, maka artikel ini merupakan solusinya. Anda dapat menambahkan icon di sebelah kiri dari teks yang terdapat di judul kolom tertentu.

Karena PHPMaker 11 sudah menggunakan Twitter Bootstrap 3 sebagai front-end framework yang dapat membuat tampilan Aplikasi Web menjadi lebih profesional dan mudah dalam pengembangan, maka kita akan mengikuti fitur yang terkait pada Bootstrap 3. Kita akan memanfaatkan salah satu icon yang disediakan pada glyphicons.

Katakanlah kita akan menampilkan icon picture di sebelah kiri judul kolom CustomerID pada table orders, maka kita sebagai Web Developer cukup hanya menambahkan sebaris kode saja pada server event Page_Load yang terdapat di bawah lokasi Server Events -> Table-Specific -> List Page, sehingga kode selengkapnya menjadi seperti ini:

// Page Load event
function Page_Load() {
	//echo "Page Load";
	Language()->setFieldPhrase("orders", "CustomerID", "fldcaption", "<i class='glyphicon glyphicon-picture'></i> Customer ID");
}

Perhatikanlah bahwa kita harus mengikuti aturan penamaan class icon picture milik glyphicon seperti contoh kode di atas. Nah, dalam hal ini kita menggunakan method setFieldPhrase milik object Language untuk mengubah teks pada judul kolom tabel yang kita inginkan.

Method setFieldPhrase memiliki 4 parameter. Parameter pertama adalah nama Table-nya, parameter kedua merupakan nama Field-nya, parameter ketiga merupakan ID dari object yang akan diubah; yang dalam hal ini adalah fldcaption, dan parameter keempat atau terakhir merupakan nilai teks yang baru.

Setelah itu, seperti biasa, generate ulang file script dengan menggunakan PHPMaker.

Wow! Betapa mudah dan cepatnya, bukan? 😀