0% menganggap dokumen ini bermanfaat (0 suara)
127 tayangan

Web Programming 2 - Membuat Controller Dan View Sederhana PDF

Modul ini menjelaskan cara membuat view dan controller baru di CodeIgniter. Langkah-langkahnya meliputi membuat file view di folder application/view, membuat controller di folder application/controllers, mengatur routing, dan memecah data ke view menggunakan variabel dan array.

Diunggah oleh

Imaniawan ID
Hak Cipta
© © All Rights Reserved
Format Tersedia
Unduh sebagai PDF, TXT atau baca online di Scribd
0% menganggap dokumen ini bermanfaat (0 suara)
127 tayangan

Web Programming 2 - Membuat Controller Dan View Sederhana PDF

Modul ini menjelaskan cara membuat view dan controller baru di CodeIgniter. Langkah-langkahnya meliputi membuat file view di folder application/view, membuat controller di folder application/controllers, mengatur routing, dan memecah data ke view menggunakan variabel dan array.

Diunggah oleh

Imaniawan ID
Hak Cipta
© © All Rights Reserved
Format Tersedia
Unduh sebagai PDF, TXT atau baca online di Scribd
Anda di halaman 1/ 13

MODUL WEB PROGRAMMING 2 – FABRIYAN FANDI DWI IMANIAWAN

Membuat View dan Controller Baru


Kali ini kita akan membuat contoh file view dan controller. Pastikan di visual
studio code sudah terinstal 5 ekstension berikut:

Seperti sudah dijelaskan sebelumnya, bahwa file view terletak di dalam folder
application/view, sedangkan Controller terletak di dalam folder
application/controllers.
MODUL WEB PROGRAMMING 2 – FABRIYAN FANDI DWI IMANIAWAN

Agar mudah memahaminya, maka kita akan coba buat file view dan controller
yang sederhana. Ikuti langkah berikut:

1. Buatlah file view dengan nama v_belajar.php di dalam folder


application/view. Klik kanan pada folder view, lalu pilih New File
MODUL WEB PROGRAMMING 2 – FABRIYAN FANDI DWI IMANIAWAN

2. Isikan code standar html di visual studio code secara otomatis dengan
cara ketik tanda seru (!) lalu tekan enter.

3. Maka akan muncul seperti ini:


MODUL WEB PROGRAMMING 2 – FABRIYAN FANDI DWI IMANIAWAN

Jika cara tersebut gagal silahkan copy paste saja code di bawah ini:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>

</body>
</html>

4. Lengkapi code diatas sebagai berikut:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Belajar Membuat View</title>
</head>
<body>
Selamat Datang, Saya Baru Mencoba Menampilkan File View di Codeigniter
</body>
</html>

5. Nah untuk menampilkan file view tsb, maka kita harus buat dahulu
controllernya. Caranya silahkan klik kanan di folder controlllers lalu pilih New
File. Beri nama file tersebut c_belajar.php
MODUL WEB PROGRAMMING 2 – FABRIYAN FANDI DWI IMANIAWAN

6. Lalu isikan kode berikut di dalam c_belajar.php. Manfaatkan snippet di vs


code. Caranya:
• Ketik “php” lalu tekan enter. Ini digunakan untuk membuat tag pembuka
(<?php) dan tag penutup (?>) secara otomatis
MODUL WEB PROGRAMMING 2 – FABRIYAN FANDI DWI IMANIAWAN

• Buat seperti gambar di atas, tag pembuka di baris 1, dan tag penutup di
baris 3
• Di Baris 2 silahkan ketik “controller” lalu tekan Enter. Ini untuk
menampilkan format code controller secara otomatis
MODUL WEB PROGRAMMING 2 – FABRIYAN FANDI DWI IMANIAWAN

• Ubah class Controllername menjadi c_belajar

7. Tambahkan code di dalam function index seperti berikut:

public function index()


{
echo "ini adalah fungsi index di dalam controller c_belajar";
}
MODUL WEB PROGRAMMING 2 – FABRIYAN FANDI DWI IMANIAWAN

8. Simpan (Ctrl+S).
9. Buka file routes.php di dalam folder application/config, lalu ubah default
controller menjadi c_belajar

10. Simpan. Buka Browser lalu ketikkan alamat localhost/belajar3b, maka


hasilnya seperti ini
MODUL WEB PROGRAMMING 2 – FABRIYAN FANDI DWI IMANIAWAN

Bagaimana kalau kita tambahkan function baru di controller c_belajar dan


arahkan ke view? Ikuti langkah berikut:

1. Tambahkan function baru di dalam controller c_belajar dengan nama


tampil_view dan isikan code di dalamnya seperti berikut:

2. Pemanggilan view secara aturan $this->load->view (‘nama_view’); Untuk


nama_view tidak perlu ditambahkan ekstensi .php
3. Buka browser, ketikkan alamat http://localhost/belajar3b/c_belajar/tampil_view,
maka hasilnya akan menampilkan isi dari view v_belajar.php seperti ini:
MODUL WEB PROGRAMMING 2 – FABRIYAN FANDI DWI IMANIAWAN

Jika file view berada di dalam subfolder, misalnya di dalam folder


application/view/belajar/v_belajar.php maka pemanggilanya pun di
functionnya akan berbeda. Menjadi $this->load->view(‘belajar/v_belajar.php’);

Cara Parsing (Memecah) Data ke View


Untuk memparsing (memecah) data kita gunakan array supaya lebih mudah.
Namun, kita akan mencoba yang sederhana terlebih dahulu dengan
menambahkan variabel di function tampil_view di dalam controller c_belajar
lalu memanggilnya di view v_belajar. Masih menggunakan contoh di atas,
silahkan tambahkan di bagian function tampil_view

Atau silahkan copy paste saja code berikut:


MODUL WEB PROGRAMMING 2 – FABRIYAN FANDI DWI IMANIAWAN

public function tampil_view()


{
$data['nama_mahasiswa'] = "Odading";
$this->load->view('v_belajar',$data);
}

Jangan lupa disimpan, lalu tambahkan code berikut di view v_belajar.php :

Atau copy saja code berikut:

<h2><?php echo $nama_mahasiswa; ?></h2>

Jika sudah, simpan dan buka kembali dibrowser dengan alamat


http://localhost/belajar3b/c_belajar/tampil_view . Hasilnya seperti ini:
MODUL WEB PROGRAMMING 2 – FABRIYAN FANDI DWI IMANIAWAN

Nah jika ingin menambahkan data lebih dari satu, kita gunakan array disini.
Ubahlah di dalam function tampil_view menjadi seperti ini:

Atau copy code berikut:

$data = array(
'nama' => "Fandi",
'jurusan' => "Sistem Informasi"
);

Lalu rubah juga di bagi v_belajar menjadi seperti ini:


MODUL WEB PROGRAMMING 2 – FABRIYAN FANDI DWI IMANIAWAN

Atau copy code berikut:

<h2><?php echo $nama; ?></h2>


<h2><?php echo $jurusan; ?></h2>

Jika sudah, simpan dan buka kembali dibrowser dengan alamat


http://localhost/belajar3b/c_belajar/tampil_view. Hasilnya seperti ini:

Anda mungkin juga menyukai