Selasa, 14 Januari 2014

Belajar membuat website dengan menggunakan Code Igniter



Tutorial Membuat Web dengan Codeigniter
Membangun sebuah website akan lebih mudah jika menggunakan framework, karena di dalamnya tersedia standard dalam melakukan koding dan dalam membuat serta menggunakan fungsi-fungsi tertentu.
Dengan menggunakan framework tentu saja sebuah proses pembuatan aplikasi web menjadi lebih cepat.
Bayangkan jika anda harus membuat masing-masing fungsi secara manual, pasti lebih lama bukan?
Codeigniter adalah salah satu framework yang paling banyak digunakan untuk mengembangkan sebuah website.
Menurut pengalaman saya, mengembangkan website dengan Codeigniter memang jauh lebih mudah ketimbang harus melakukan koding dari awal. Ditambah lagi, Codeigniter termasuk salah satu framework yang mudah dipelajari.

Pengertian Model View Controller (MVC) Codeigniter

Codeigniter adalah sebuah framework untuk pengembangan aplikasi web site menggunakan PHP.
Dengan menggunakan Codeigniter, kita dapat melakukan pengembangan situs dengan lebih cepat daripada membuat nya dari awal karena Codeigniter memiliki banyak library yang memudahkan kita untuk membuat berbagai macam fungsi.
Selain itu, Codeigniter juga memudahkan kita dari segi coding termasuk mengurangi banyaknya code yang harus kita pikirkan dalam membuat website.

 

Pengertian MVC di Codeigniter

MVC atau Model – View – Controller adalah development pattern yang memisahkan logic aplikasi dengan bagian presentation.
Codeigniter dibuat dengan menggunakan model MVC sehingga meminimalkan coding yang harus kita buat.

Model

Model merepresentasikan struktur data dari aplikasi kita. Pada intinya, di model ini memiliki banyak fungsi yang terfokus untuk melakukan retrieve, insert, update, dan delete record dari database.

View

View adalah bagian yang diperlihatkan pada user. Jadi, halaman web yang ditampilkan di browser adalah code yang kita tuliskan di bagian view. Sebuah view dapat berupa file penuh, atau hanya potongan seperti header atau footer.

Controller

Controller bertugas untuk menjembatani antara model dan view. Selain itu controller juga bertugas untuk mengambil library yang ada pada Codeigniter.
Di dalam Codeigniter, kita tidak harus selalu menggunakan ketiga bagian di atas, kita bisa saja tidak menggunakan model jika aplikasi kita tidak mengambil data dari dalam database.
pengertian mvc di codeigniter
Logo Codeigniter
Selain itu kita juga dapat melakukan coding fungsi retrieve database di dalam controller. Hal ini memudahkan developer untuk melakukan coding di bagian manapun dia inginkan.

Insert Data Menggunakan Codeigniter

Tutorial ini membahas mengenai cara membuat fungsi insert data menggunakan Codeigniter. Data yang diinsert menggunakan desain database yang telah dibahas pada tutorial sebelumnya.
Sebelum melangkah lebih jauh untuk membuat fungsi insert ini, anda perlu mengetahui bahwa di dalam Codeigniter terdapat tiga buah direktori utama untuk melakukan coding. Direktori tersebut adalah controller, model, dan view dimana ketiganya terletak di dalam folder application di dalam file web Codeigniter anda.

Insert Data Menggunakan Codeigniter

Di dalam tutorial ini tidak dibahas mengenai alur berpikir darimana anda membuat fungsi tersebut, melainkan  langsung dibahas best  practices nya saja.
Setiap programmer memiliki style nya sendiri dalam melakukan coding, jadi terserah anda ingin memulainya dari folder controller, model, atau view. Saya akan menuliskan source code berurutan dari folder controller, model, dan view.

Controller

Pertama buatlah file user_controller.php di dalam direktori application/controller dan isikan source berikut:
user_controller.php
?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
<?php
class User_controller extends CI_Controller{

    function __Construct()
    {
        parent ::__construct();
    }

    function user()
    {
        $data['judul'] = 'Insert Data User';
        $this->load->view('user', $data);
    }

    function simpan_user()
    {  
        $this->load->model('user_model');
        $this->user_model->simpan_user();
        $data['notifikasi'] = 'Data berhasil disimpan';
        $data['judul']='Insert Data Berhasil';
        $this->load->view('notifikasi', $data);
    }
}
Nb: di dalam codeigniter tidap perlu menggunakan tag php penutup

Model

Selanjutnya bualah file user_model.php di dalam direktori application/model dan isikan source berikut:
Perhatikan bahwa kita akan menggunakan libraries database dari Codeigniter, maka dari itu bukalah file autoload di application/config/autoload.php dan tambahkan database di autoload libraries.
?
1
 $autoload['libraries'] = array('database');
user_model.php
?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
<?php
class User_model extends CI_Model{

    function simpan_user()
    {
        $simpan_data=array(
            'nama_lengkap'  => $this->input->post('nama_lengkap'),
            'username'      => $this->input->post('username'),
            'password'      => md5($this->input->post('password')),
            'email'         => $this->input->post('email'),
            'alamat'        => $this->input->post('alamat')
       );
        $simpan = $this->db->insert('user', $simpan_data);
        return $simpan;
    }
}

 

Views

Terakhir, buatlah file sebagai view dan notifikasi ketika data berhasil di simpan. Di sini saya membuat dua buah file yaitu user.php dan notifikasi.php di dalam direktori application/view
user.php
?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
<html>
    <head>
        <title><?php echo $judul; ?></title>
    </head>
    <body>                       
    <h1>Insert Data User</h1>
    <form action="simpan_user" method="post">
        <table>
            <tr>
                <td>Nama Lengkap</td>
                <td><input type="text" name="nama_lengkap"/></td>
            </tr>
            <tr>
                <td>Username</td>
                <td><input type="text" name="username"/></td>
            </tr>
            <tr>
                <td>Password</td>
                <td><input type="password" name="password"/></td>
            </tr>
            </tr>
                <td>Email</td>
                <td><input type="text" name="email"/></td>
            </tr>
            <tr>
                <td>Alamat</td>
                <td><textarea name="alamat" style="height: 80px;"></textarea></td>
            <tr>
                <td></td>
                <td><input type="submit" value="Simpan"/></td>
            </tr>
        </table>
    </form>
    </body>
</html>
notifikasi.php
?
1
2
3
4
5
6
7
8
<html>
<head>
    <title><?php echo $judul; ?></title>
</head>
<body>
    <p><?php echo $notifikasi; ?></p>
</body>
</html>
Oke, sekarang fungsi tersebut telah selesai, anda dapat mencoba menjalankannya di browser dengan URL http://localhost/codeigniter/index.php/user_controller/user
Setelah anda klik Simpan, data yang anda isikan akan tersimpan di dalam database.

Menampilkan Data dari Database Menggunakan Codeigniter

Pada tutorial sebelumnya telah saya bahas mengenai cara untuk membuat fungsi insert data ke dalam database.
Ditutorial ini saya akan memberikan contoh untuk menampilkan data yang sebelumnya telah tersimpan di dalam database.
Sebelum melangkah lebih jauh, saya sarankan anda untuk mengisi table user terlebih dahulu. Anda dapat mengisinya secara manual.

Menampilkan Data dari Database Menggunakan Codeigniter

Berikut ini adalah source code yang ada di controller, model, dan view. Meskipun nama file di tutorial ini sama seperti tutorial sebelumnya, tetapi isi dari source code sudah berbeda. Jadi jangan asal copas ketika anda ingin menggabungkan tutorial ini dengan tutorial sebelumnya.

Controller

Buatlah sebuah file dengan nama user_controller.php dan isikan code sebagai berikut:
user_controller.php
?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
<?php
class User_controller extends CI_Controller{

    function __Construct()
    {
        parent ::__construct();
    }

    function user()
    {
        $this->load->model('user_model');
        $data['judul'] = 'Menampilkan Data dari Database Menggunakan Codeigniter';
        $data['daftar_user'] = $this->user_model->get_user_all();
        $this->load->view('daftar_user', $data);
    }
}

Model

Buatlah sebuah file dengan nama user_model.php dan isikan code sebagai berikut:
?
1
2
3
4
5
6
7
8
9
<?php
class User_model extends CI_Model{

    function get_user_all()
    {
        $query=$this->db->query("SELECT * FROM user ORDER BY id_user DESC");
        return $query->result();
    }
}

Views

Buatlah sebuah file dengan nama daftar_user.php dan isikan code sebagai berikut:
?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
<html>
<head>
    <title><?php echo $judul; ?></title>
</head>
<body>
    <h1>Daftar User</h1>
    <table border="1">
        <thead>
        <tr>
            <th>Nama Lengkap</th>
            <th>Username</th>
            <th>Email</th>
            <th>Alamat</th>
        </tr>
    </thead>
    <tbody>
            <?php
                foreach($daftar_user as $user){
        ?>
                <tr>
            <td><?php echo $user->nama_lengkap; ?></td>
            <td><?php echo $user->username; ?></td>
            <td><?php echo $user->email; ?></td>
            <td><?php echo $user->alamat; ?></td>
        </tr>
           <?php } ?>
    </tbody>
    <tfoot>
        <tr>
            <th>Nama Lengkap</th>
            <th>Username</th>
            <th>Email</th>
            <th>Alamat</th>
        </tr>
    </tfoot>
    </table>
</body>
</html>
Sekarang cobalah untuk menjalankan URL http://localhost/codeigniter/index.php/user_controller/user melalui browser.
Jika code yang anda masukkan benar, maka seluruh data di dalam tabel user akan muncul.
menampilkan data dari database menggunakan codeigniter

 

 

Membuat Fungsi Delete Record Menggunakan Codeigniter

Biasanya, fungsi delete record terdapat di halaman admin sebuah website dimana hanya web administrator saja yang memiliki hak akses untuk melakukannya.
Tutorial ini melanjutkan dari tutorial sebelumnya yang membahas tentang menampilkan data dari dalam database. Di tutorial ini kita akan menambahkan fungsi delete untuk menghapus data tersebut dari dalam database.
Anda dapat menggunakan file di tutorial sebelumnya, dan mengubah source code di tutorial tersebut mengikuti source di bawah:

Delete Record Menggunakan Codeigniter

Berikut ini adalah source code untuk membuat delete record menggunakan Codeigniter. Seperti biasa saya menuliskan source code berurutan dari controller, model, dan terakhir di bagian views.

Controller

Perlu diperhatikan bahwa dari source code di bawah kita menggunakan URL helper dari Codeigniter. Oleh karena itu pastikan anda menyertakan helper URL di folder application/config/autoload.php
?
1
$autoload['helper'] = array('url');
Tambahkan source code di user_controller.php menjadi seperti berikut:
user_controller.php
?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
<?php
class User_controller extends CI_Controller{

    function __Construct()
    {
        parent ::__construct();
    }

    function user()
    {
        $this->load->model('user_model');
        $data['judul'] = 'Delete Record Menggunakan Codeigniter';
        $data['daftar_user'] = $this->user_model->get_user_all();
        $this->load->view('daftar_user', $data);
    }

    function delete_user($id_user)
    {
        $this->load->model('user_model');
        $username = $this->user_model->delete_user($id_user);
        redirect('user_controller/user');
    }
}

Model

Bukalah file user_model.php dan tambahkan fungsi untuk melakukan delete record seperti pada source berikut:
user_model.php
?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
<?php
class User_model extends CI_Model{

    function get_user_all()
    {
        $query=$this->db->query("SELECT * FROM user ORDER BY id_user DESC");
        return $query->result();
    }

    function delete_user($id_user)
    {
        $query=$this->db->query("DELETE FROM user WHERE id_user='$id_user'");
    }
}

Views

Bukalah daftar_user.php dan sesuaikan dengan source code berikut ini:
daftar_user.php
?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
<html>
<head>
    <title><?php echo $judul; ?></title>
</head>
<body>
    <h1>Daftar User</h1>
    <table border="1">
        <thead>
        <tr>
            <th>Nama Lengkap</th>
            <th>Username</th>
            <th>Email</th>
            <th>Alamat</th>
            <th>Action</th>
        </tr>
    </thead>
    <tbody>
            <?php
            foreach($daftar_user as $user){
            ?>

        <tr>
            <td><?php echo $user->nama_lengkap; ?></td>
            <td><?php echo $user->username; ?></td>
            <td><?php echo $user->email; ?></td>
            <td><?php echo $user->alamat; ?></td>
            <td><?php echo '<a href="'.base_url().'index.php/user_controller/delete_user/'.$user->id_user.'" onclick="return confirm(\'Anda yakin akan menghapus '.$user->username.'?\')">Delete</a>'?></td>
        </tr>
           <?php } ?>
    </tbody>
    <tfoot>
        <tr>
            <th>Nama Lengkap</th>
            <th>Username</th>
            <th>Email</th>
            <th>Alamat</th>
            <th>Action</th>
        </tr>
    </tfoot>
    </table>
</body>
</html>
Cobalah untuk menjalankan aplikasi tersebut dengan URL http://localhost/codeigniter/index.php/user_controller/user
Ketika anda klik delete, maka akan muncul peringatan yang jika di OK maka database akan dihapus dari dalam database.

delete record menggunakan codeigniter
Delete Record


Melakukan Update Data dari Database dengan Codeigniter

Tutorial sebelumnya telah dijelaskan cara untuk membuat fungsi insert dan delete data yang ada di dalam database. Selain dua fungsi di atas, masih ada satu fungsi lagi yang kurang, yaitu fungsi update database dengan Codeigniter.
Fungsi update ini sangat penting di dalam sebuah website, karena tidak mungkin kita menghapus data yang lama dan melakukan insert terhadap data yang baru hanya karena kesalahan inputan. Oleh karenanya, dibutuhkan fungsi update database yang dapat mengedit data sehingga tidak perlu untuk menghapus data yang telah disimpan sebelumnya.

Update Database dengan Codeigniter

Seperti biasa saya akan menulisakan urutan source cara membuat fungsi update database dengan codeigniter ini secara berurutan dari controller, model, dan views.
Jika anda telah membaca tutorial sebelumnya, yaitu membuat fungsi delete record database, sebenarnya konsep yang ada tidak berbeda jauh.

Controller

Fungsi di dalam controller ini cukup banyak, karena kita harus menampilkan data yang ada di dalam database, kemudian memberikan fungsi untuk update, dan terakhir membuat fungsi untuk  menyimpan update tersebut.
user_controller.php
?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
<?php
class User_controller extends CI_Controller{

    function __Construct()
    {
        parent ::__construct();
    }

    function user()
    {
        $this->load->model('user_model');
        $data['judul'] = 'Daftar User';
        $data['daftar_user'] = $this->user_model->get_user_all();
        $this->load->view('daftar_user', $data);
    }

    function edit_user($id_user)
    {
        $data['judul']='Update Data User';
        $this->load->model('user_model');
        $data['edit']=$this->user_model->edit_user($id_user);
        $this->load->view('edit_user', $data);
    }

    function simpan_edit_user()
    {
        $id_user = $this->input->post('id_user');
        $nama_lengkap = $this->input->post('nama_lengkap');
        $username = $this->input->post('username');
        $password = $this->input->post('password');
        $email = $this->input->post('email');
        $alamat = $this->input->post('alamat');

        $data['judul'] = 'Update Data Codeigniter';
        $this->load->model('user_model');
        $data['edit'] = $this->user_model->simpan_edit_user($id_user, $nama_lengkap, $username, $password, $email, $alamat);
        $data['notifikasi'] = 'Data telah berhasil disimpan';
        $this->load->view('notifikasi', $data);
    }
}

Model

Sama seperti controller, fungsi di dalam model juga cukup banyak, tetapi saya rasa tidak perlu untuk menjelaskannya satu persatu. Anda dapat memahaminya dengan membaca nama fungsinya.
user_model.php
?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
<?php
class User_model extends CI_Model{

    function get_user_all()
    {
        $query=$this->db->query("SELECT * FROM user ORDER BY id_user DESC");
        return $query->result();
    }

    function edit_user($id_user)
    {
        $q="SELECT * FROM  user WHERE id_user='$id_user'";
        $query=$this->db->query($q);
        return $query->row();
    }

    function simpan_edit_user($id_user, $nama_lengkap, $username, $password, $email, $alamat)
    {
        $data = array(
            'id_user'        => $id_user,
            'nama_lengkap'   => $nama_lengkap,
            'username'       => $username,
            'password'       => $password,
            'email'          => $email,    
            'alamat'         => $alamat
        );
        $this->db->where('id_user', $id_user);
        $this->db->update('user', $data);   
    }
}

Views

Di dalam views ini terdapat dua halaman view, yang pertama adalah untuk menampilkan halaman awal, kemudian yang kedua digunakan untuk melakukan edit data, dan terakhir adalah notifikasi bahwa data berhasil disimpan.
Views yang pertama adalah daftar_user.php yang digunakan untuk menampilkan seluruh data yang ada di dalam database.
daftar_user.php
?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
<html>
<head>
    <title><?php echo $judul; ?></title>
</head>
<body>
    <h1>Daftar User</h1>
    <table border="1">
        <thead>
        <tr>
            <th>Nama Lengkap</th>
            <th>Username</th>
            <th>Email</th>
            <th>Alamat</th>
            <th>Action</th>
        </tr>
    </thead>
    <tbody>
            <?php
            foreach($daftar_user as $user){
            ?>

        <tr>
            <td><?php echo $user->nama_lengkap; ?></td>
            <td><?php echo $user->username; ?></td>
            <td><?php echo $user->email; ?></td>
            <td><?php echo $user->alamat; ?></td>
            <td><?php echo '<a href="'.base_url().'index.php/user_controller/edit_user/'.$user->id_user.'">Edit</a>'?></td>
        </tr>
           <?php } ?>
    </tbody>
    <tfoot>
        <tr>
            <th>Nama Lengkap</th>
            <th>Username</th>
            <th>Email</th>
            <th>Alamat</th>
            <th>Action</th>
        </tr>
    </tfoot>
    </table>
</body>
</html>
Views yang kedua adalah edit_user.php yang digunakan untuk mengedit inputan record yang telah tersimpan di dalam database.
edit_user.php
?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
<html>
    <head>
        <title><?php echo $judul; ?></title>
    </head>
    <body>                       
    <h1>Update Data User</h1>

    <?php
        $att = array('id' => 'biodata-form');
        echo form_open('user_controller/simpan_edit_user', $att);
        echo form_hidden('id_user',$edit->id_user);
    ?>
        <table>
            <tr>
                <td>Nama Lengkap</td>
                <td><input type="text" name="nama_lengkap" value="<?php echo $edit->nama_lengkap; ?>"/></td>
            </tr>
            <tr>
                <td>Username</td>
                <td><input type="text" name="username" value="<?php echo $edit->username; ?>"/></td>
            </tr>
            <tr>
                <td>Password</td>
                <td><input type="password" name="password" value="<?php echo $edit->password; ?>"/></td>
            </tr>
            </tr>
                <td>Email</td>
                <td><input type="text" name="email" value="<?php echo $edit->email; ?>"/></td>
            </tr>
            <tr>
                <td>Alamat</td>
                <td><textarea name="alamat" style="height: 80px;"><?php echo $edit->alamat; ?></textarea></td>
            <tr>
                <td></td>
                <td><input type="submit" value="Simpan"/></td>
            </tr>
        </table>
    </form>
    </body>
</html>
Views terakhir adalah untuk notifikasi.php untuk memberikan informasi bahwa data telah berhasil diupdate. Sebenarnya notifikasi tersebut dapat digabungkan dengan daftar_user.php, tetapi sengaja saya pisahkan agar tidak membingungkan bagi anda yang baru pertama kali belajar php maupun Codeigniter.
notifikasi.php
?
1
2
3
4
5
6
7
8
<html>
<head>
    <title><?php echo $judul; ?></title>
</head>
<body>
    <p><?php echo $notifikasi; ?></p>
</body>
</html>
Anda dapat mencoba source code yang telah selesai dibuat dengan cara mengetikkan URL pada browser: http://localhost/codeigniter/index.php/user_controller/user
update database dengan codeigniter
Daftar User
update database dengan codeigniter
Update Data
Kemudian cobalah untuk melakukan edit data dan klik Simpan.
Jika source anda ketikkan dengan benar, maka data di dalam database akan berhasil di update.

Membuat Validasi Form Menggunakan Codeigniter

Tutorial insert, update dan delete records menggunakan Codeigniter telah dijelaskan pada tutorial sebelumnya. Artinya, anda seharusnya sudah dapat membuat aplikasi web menggunakan Codeigniter dengan fungsi CRUD standard.
Tetapi jangan puas dulu, sebab rasanya tidak akan lengkap jika form yang digunakan untuk menginput data belum terdapat validasi. Pada tutorial kali ini kita akan belajar menggunakan validasi form Codeigniter.

 

Validasi Form Codeigniter

Membuat form validation menggunakan Codeigniter tidaklah sulit, sebab Codeigniter memiliki class bernama Form Validation yang memudahkan anda untuk menggunakan validasi form Codeigniter.
Kita hanya perlu memanggil class tersebut dan menggunakannya di source code yang kita buat. Anda tidak perlu membuat script dan semacamnya.
Di tutorial ini kita tidak menggunakan database, sehingga kita hanya akan coding di Controller dan Views.

Controller

Buatlah file yang bernama form_controller.php dan ketikkan source code sebagai berikut:
form_controller.php
?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
<?php

class Form_controller extends CI_Controller {
    function index()
    {
        $this->load->helper(array('form', 'url'));
        $this->load->library('form_validation');

        $this->form_validation->set_rules('username', 'Username', 'required');
        $this->form_validation->set_rules('password', 'Password', 'required');
        $this->form_validation->set_rules('passconf', 'Password Confirmation', 'required');
        $this->form_validation->set_rules('email', 'Email', 'required');

        if ($this->form_validation->run() == FALSE)
        {
            $this->load->view('form_input');
        }
        else
        {
            echo 'validasi sukses!';
        }
    }
}
Perhatikan code ketika memanggil helper dan library:
?
1
2
$this->load->helper(array('form', 'url'));
$this->load->library('form_validation');
Anda perlu menuliskan dua baris code tersebut untuk memanggil helper form dan URL  serta library form validation yang digunakan untuk melakukan validasi.
Selain menuliskannya pada controller, anda juga dapat menambahkannya di autoload.php

Views

Form yang digunakan untuk menginput data kita beri nama dengan form_input.php
form_input.php
?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
<html>
<head>
<title>Input Data</title>
</head>
<body>

    <?php echo form_open('form_controller'); ?>

    <h4>Username</h4>
    <?php echo form_error('username'); ?>
    <input type="text" name="username" value="<?php echo set_value('username'); ?>" size="30" />

    <h4>Password</h4>
    <?php echo form_error('password'); ?>
    <input type="text" name="password" value="<?php echo set_value('password'); ?>" size="30" />

    <h4>Password Confirm</h4>
    <?php echo form_error('passconf'); ?>
    <input type="text" name="passconf" value="<?php echo set_value('passconf'); ?>" size="30" />

    <h4>Email Address</h4>
    <?php echo form_error('email'); ?>
    <input type="text" name="email" value="<?php echo set_value('email'); ?>" size="30" />

    <div><input type="submit" value="Submit" /></div>

    </form>

</body>
</html>
Cobalah untuk menjalankan URL http://localhost/codeigniter/index.php/form_controller pada  browser. Jika form anda biarkan kosong, maka akan muncul peringatan bahwa form harus diisi. Sedangkan jika form sudah terisi, maka akan muncul validasi sukses!
validasi form codeigniter
Validasi Form Codeigniter
Perhatikan bahwa validasi form tersebut hanya untuk form tidak boleh kosong, anda harus memodifikasi rule yang ada jika ingin melakukan pengecekan terhadap inputan user seperti password harus sama, email harus benar, dan sebagainya.

Membuat Halaman Login CodeIgniter
Melanjutkan tutorial sebelumnya, kali ini kita akan mulai berurusan dengan coding.
Post kali ini membahas mengenai bagaimana membuat halaman form login.
Catatan: pada tutorial kali ini dan selanjutnya, minimal anda harus mengetahui konsep dasar MVC di CodeIgniter dan setidaknya anda telah membaca User Guide dari CodeIgniter supaya tidak terlalu kebingungan ketika membaca dokumentasi berikut ini. Di sarankan anda juga mengerti atau minimal mengetahui sedikit tentang PHP, HTML dan CSS.



Untuk membuat halaman login, anda dapat melihat code berikut sebagai referensi:
C:\xampp\htdocs\simatik\application\controllers\login.php
?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
<?php
class Login extends CI_Controller{

    public function index()
    {
        $data['judul'] = 'Web Portal › SIMATIK';
        $this->load->view('login', $data);   
    }

    function validate_login(){

        $this->load->model('user_model');
        $query = $this->user_model->validate();

        if($query){

            $data = array(
                'username' => $this->input->post('username'),
                'is_logged_in' => TRUE          
            );

            $this->session->set_userdata($data);
            redirect('site/home');     
        }else{

            $this->index();                 
        }  
    }
}
Bagian view untuk tampilan form login adalah sebagai berikut
C:\xampp\htdocs\simatik\application\views\login.php
?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
<!DOCTYPE html
  PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
        <title><?php echo $judul;?></title>
        <link href="<?php echo base_url();?>css/login.css" rel="stylesheet" type="text/css"/>
        <link href="<?php echo base_url();?>favicon.ico" rel="icon"/>
    </head>
        <body>
        <div id="wrapper">
            <div id="spacer"> 
            </div>
            <div id="konten">
                <div id="left-side">
                    <?php $this->load->view('includes/left-side-login');?>
                </div>

                <div id="right-side">
                        <h1>SEKOLAH MENENGAH ATAS STATISTIK</h1>
                        <br/><br/><br/>
                        <h2>Login</h2>
                        <p><?php if(isset($notifikasi)) echo $notifikasi;?></p>
                        <?php
                        $attributes = array('id' => 'login-form');
                        echo form_open('login/validate_login', $attributes);
                        ?>

                            <table id="log-tabel">
                                <tr>
                                    <td>Username</td>
                                    <td><input type="text" name="username" class="log-form" value="" maxlength="1024"/></td>
                                </tr>
                                <tr>
                                    <td>Password</td>
                                    <td><input type="password" name="password" class="log-form" value="" maxlength="1024"/></td>
                                </tr>
                                <tr>
                                    <td></td>
                                    <td><input type="submit" value="" class="login-button"/></td>
                                </tr>
                            </table>
                        <?php
                        echo form_close();
                        ?>

                        <p>Jika anda belum mempunyai username dan password silahkan aktifkan akun anda terlebih dahulu dengan menghubungi admin</p>           
                </div> 
            <div id="footer">
                <div id="footer-p">
                    <?php $this->load->view('includes/footer-login');?>
                </div>
            </div>
        </div>
        </div>       
    </body>
</html>
Selanjutnya untuk bagian model C:\xampp\htdocs\simatik\application\models\user_model.php
?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
<?php
class User_model extends CI_Model{

    function validate()
        {
            $this->db->where('username', $this->input->post('username'));
            $this->db->where('password', md5($this->input->post('password')));
            $query = $this->db->get('user');

            if($query->num_rows == 1)
            {
                return TRUE;
            }
    }
}
Dari model tersebut akan diarahkan ke controller lain yaitu site.php dengan fungsi home C:\xampp\htdocs\simatik\application\controllers\site.php
?
1
2
3
4
5
6
7
8
9
<?php
class Site extends CI_Controller{
    function home()
    {
        $data['judul'] = 'SIMATIK › Home';
        $data['main_content'] = 'main_content/home';
        $this->load->view('template', $data);
    }
}
Dan terakhir adalah bagian view C:\xampp\htdocs\simatik\application\view\main_content\home.php
Halaman home.php dapat anda buat halaman dummy terlebih dahulu.


Membuat Insert Post Web Menggunakan CodeIgniter

Melanjutkan tutorial sebelumnya mengenai CodeIgniter. Pada post kali ini adalah dokumentasi mengenai cara membuat insert post menggunakan CodeIgniter.
Skenario dari fungsi insert ini adalah, ada sebuah form yang akan diisi dengan artikel tertentu dan ketika di klik tombol submit, maka form tersebut akan menyimpan ke dalam database.
Jika artikel berhasil di simpan, maka muncul peringatan bahwa post berhasil di simpan, begitu juga sebaliknya.

Fungsi Insert

Untuk mempermudah dalam berpikir, pertama kita buat terlebih dahulu bagian view nya: tambah_berita.php
?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
<h1>Tambah Berita</h1>
<form id="biodata-form" action="simpan_berita" method="post" enctype="multipart/form-data">
    <table id="tabel-biodata">
        <tr>
            <td>Judul</td>
            <td><input type="text" name="judul_berita" class="biodata" value="" maxlength="1024"/></td>
        </tr>
        <tr>
            <td></td>
            <td><input type="hidden" name="uploader" class="biodata" value="<?php echo $this->session->userdata('username');?>" maxlength="1024"/></td>
        </tr>

        <tr>
            <td>Kategori</td>
            <td>
                <?php
                $attributes = 'class = "biodata"';
                $pilih = '';
                echo form_dropdown("id_kategori", $opt_kategori, $pilih, $attributes);
                ?>                                       
            </td>
        </tr>
        <tr>
            <td>Status</td>
            <td>
                <select name="status" class="biodata">
                    <?php if ($status==1){?>
                            <option value="1" selected="selected">Aktif</option>
                            <option value="0" >Nonaktif</option>
                    <?php }else{?>
                            <option value="1" >Aktif</option>
                            <option value="0" selected="selected">Nonaktif</option>
                    <?php }?>
                </select>
            </td>
        </tr>
        <tr>
            <td></td>
            <td style="text-align: right;">Isi Artikel</td>
        </tr>
        <tr>
            <td colspan="2"><textarea name="isi_berita" class="biodata" value="" style="height: 500px; width: 600px"></textarea></td>
        </tr>
        <tr>
            <td></td>
            <td style="text-align: right;"><br /><input type="submit" value="Simpan" class="button"/></td>
        </tr>
    </table>
</form>
Selanjutnya dari form submit akan menuju ke bagian controller, yaitu: berita_admin dengan fungsi simpan_berita
?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
<?php
class Berita_admin extends CI_Controller{

function __Construct()
{
    parent ::__construct();
    $this->is_logged_in();  
}

function berita()
{
    $total = $this->berita_model->hitung_berita();

    $data['judul'] = 'SIMATIK &rsaquo; Pengaturan Berita';
    $data['main_content'] = 'admin/berita';
    $data['berita'] = $this->berita_model->get_berita();
    $this->load->view('admin_template', $data);
}

function simpan_berita()
{  
    $judul_berita = $this->input->post('judul_berita');
    $id_kategori = $this->input->post('id_kategori');
    $isi_berita = $this->input->post('isi_berita');
    $uploader = $this->input->post('uploader');
    $status = $this->input->post('status');

    $this->berita_model->simpan_berita($judul_berita, $id_kategori, $isi_berita, $uploader, $status);
    redirect('berita_admin/berita');
}
}
Di dalam fungsi simpan_berita, model simpan_berita yang ada di berita_model.php akan diakses, jika berhasil, maka controller akan melakukan redirect ke halaman akhir dan memberikan notifikasi bahwa berita berhasil disimpan.
?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
<?php

class Berita_model extends CI_Model{
    function get_berita()
    {
        $array_keys_values = $this->db->query("SELECT k.nama_kategori, b.* FROM kategori k, berita b WHERE k.id_kategori = b.id_kategori ORDER BY tanggal DESC");
        return $array_keys_values;
    }

    function simpan_berita($judul_berita, $id_kategori, $isi_berita, $uploader, $status)
    {
        $data = array(
            'judul_berita' => $judul_berita,
            'id_kategori'  => $id_kategori,
            'isi_berita'   => $isi_berita,
            'uploader'     => $uploader,
            'status'       => $status
            );

        $this->db->insert('berita', $data);
    }
}


Semoga bermanfaat belajar membuat website dengan menggunakan Code Igniter.






Diposting oleh di

8 komentar:

  1. Informal15 Januari 2014 pukul 01.27

    lu harus follow blog gw...
    steel-ford.blogspot.com

    BalasHapus
    Balasan
    1. Anonim8 November 2014 pukul 08.05

      gimana caranya menggabungkan antara: Insert, View, Delete, Update, dan Validasi jadi satu paket bro.?

      Hapus
  2. BijanSaja21 Desember 2014 pukul 22.19

    punya sy error pada bagian ini
    $att = array('id' => 'bodata-form');
    echo form_open('user_controller/simpan_edit_user', $att);
    echo form_hidden('id_user', $edit->id_user);
    kira2 knpa ya? terimakasih.

    BalasHapus
  3. Unknown24 April 2015 pukul 20.08

    very useful and broaden,, thanks for the information ...

    http://goo.gl/WkPZ2C

    BalasHapus
  4. Unknown12 Mei 2015 pukul 22.00

    artikelnya bagus...

    tp,bisa diganti warna text blognya bro...
    sakit mata sy ngeliatnya...

    BalasHapus
  5. snack cantik26 Oktober 2015 pukul 15.17

    ini blog bagus..
    tapi lupa cara mengajarkan buat database di php myadmin
    percuma lu bikin cara membuat website kalo lu ga ngajarin buat databasenya, ya ga bakal masuk dan ga bakal konek ke database

    BalasHapus
  6. Unknown6 Maret 2016 pukul 18.04

    keren mas, tapi blum implementasi aku ahahahah

    BalasHapus
  7. Unknown27 November 2017 pukul 16.50

    Sangat membantu mas, thanks

    BalasHapus

Langganan: Posting Komentar (Atom)