Assalammu'alaikum Warahmatullahi Wabarakatuh..
Maka jika anda jalankan dibrowser dengan alamat http://localhost:latihan/login.html maka akan tampil seperti berikut :
silahkan anda buka folder codeigniter anda dan lakukan proses konfigurasi. Proses konfigurasi sudah saya posting
disini
Kedua :
Jika anda sudah mengikuti proses konfigurasi dari artikel yang saya buat, tentu saja
routes.php memiliki potongan script seperti ini
$route['default_controller'] = 'login';
Nah tugas kita membuat controllers bernama
login seperti pada script diatas yang berwarna merah. Karena fungsi controllers sebagai pengatur link setiap halaman. Oke langsung saja kalian buka folder
controllers lalu buat file dengan nama
login.php nama yang sama seperti pada routes dan anda buka file
welcome.php lalu copy pada script
welcome.php dan pastekan pada file
login.php maka akan seperti berikut :
<?php
defined('BASEPATH') OR exit('No direct script access allowed');
class Welcome extends CI_Controller {
public function index()
{
$this->load->view('welcome_message');
}
}
Selanjutnya silahkan anda Ubah pada penamaan class yang sebelumnya bernama Welcome seperti script berwarna merah menjadi Login
*Ingat penamaan class harus diawali huruf besar.
Selanjutnya ubah view pada script berwarna merah, yang sebelumnya welcome_message menjadi tampilan_login, maka keseluruhan script controllers login.php
<?php
defined('BASEPATH') OR exit('No direct script access allowed');
class Login extends CI_Controller {
public function index()
{
$this->load->view('tampilan_login');
}
}
atau seperti pada gambar berikut :
Nah perhatikan script diatas yang berwarna merah yakni tampilan_login itu merupakan view yang akan kita buat
Sehingga struktur controllers seperti berikut
Oke sudah selesai membuat controllers baru dengan nama
login.php
Selanjutnya sesuai script
login.php pada controllers yang terdapat view dengan nama
tampilan_login, maka kita akan buat view nya. Pertama-tama kalian buka extract pada folder template->lalu pilih file
login.php dan copy isi seluruhnya seperti gambar berikut;
Setelah itu anda buka folder view pada folder codeigniter lalu buat file dengan nama
tampilan_login.php seperti pada gambar berikut :
Dan pastekan pastekan pada file
tampilan_login.php , maka hasilnya seperti berikut ketika anda jalankan di browser dengan alamat
http://localhost:8080/CI/
Bagaimana sudah berhasil? apabila belum berhasil silahkan komen, dan apabila saya terlalu singkat menjelaskan silahkan kritik. Dan apabila anda berhasil tentu saja halaman tersebut belum bisa berfungsi kan? nanti akan saya buatkan fungsinya.
Oia lupa jangan lupa pada script diatas sebelum script
assets seperti
<link rel="stylesheet" href="assets/css/bootstrap.min.css" /> maka wajib untuk menambahkan menjadi
<link rel="stylesheet" href="<?php echo base_url();?>assets/css/bootstrap.min.css" /> seluruhnya sebelum script assets anda tambahkan
<?php echo base_url();?> berfungsi untuk menampilkan file css javascript yang sudah dibuat..
Setelah selesai semua silahkan anda refresh, apakah tampilannya berubah? apabila berubah berarti ada yang salah dan silahkan cek script assets nya dan apabila tetap berarti anda sukses..
Oke selanjutnya saya ingin membuang beberapa tampilan yang belum akan kita buat dan hasil akhirnya seperti berikut :
Setelah selesai kita akan aktifkan halaman login ini, caranya adalah perhatikan script :
<form> l
lalu tambahkan menjadi seperti berikut
<form method="POST" action="<?php echo base_url();?>index.php/login/getlogin" onsubmit="return cekform();">
*Keterangan :
- Method : seperti default kita menggunakan POST
- Action : Itu merupakan aksi yang akan dijalankan yakni dari
index.php akan memanggil controller bernama
login yang akan kita buat
getlogin untuk mengaktifkan fungsi loginnya.
Jadi :
Index.php merupakan halaman pertama dari controllers yang bernama
login dan membuat
getlogin untuk fungsinya ..
-
onsubmit : untuk mengecek validasi data login seperti username dan password kita beri nama validasi ini dengan nama
cekform()..
Oke??
Oke sebelum kita menambahkan
getlogin pada controllers login, saya ingin menyelesaikan script dihalaman view
tampilan_login.php ini. Oke fokuskan perhatian anda kepada script
<input type="text" class="form-control" placeholder="Username" />
Akan ada tambahan menjadi
<input type="text" name="username" id="username" class="form-control" placeholder="Username" />
dan untuk password juga sama
<input type="password" class="form-control" placeholder="Password" />
Akan ada tambahan menjadi
<input type="password" name="password" id="password" class="form-control" placeholder="Password" />
Keterangan : Penambahan
name dan id ini untuk membantu saat membuat fungsi pada
getlogin ..
Oke selanjutnya ubah script button menjadi
<button type="submit" class="width-35 pull-right btn btn-sm btn-primary">
Silahkan anda masukan username dan password secara asal, maka apabila klik button muncul seperti ini berarti anda berhasil:
Oke selanjutnya, kalian buka controllers
login, lalu tambahkan script
public function getlogin()
{
$u = $this->input->post('username');
$p = $this->input->post('password');
$this->load->model('model_login');
$this->model_login->getlogin($u,$p);
}
dibawah kurung kurawal tutup class login atau keseluruhan script controllers
login seperti berikut :
<?php
defined('BASEPATH') OR exit('No direct script access allowed');
class Login extends CI_Controller {
public function index()
{
$this->load->view('tampilan_login');
}
public function getlogin()
{
$u = $this->input->post('username');
$p = $this->input->post('password');
$this->load->model('model_login');
$this->model_login->getlogin($u,$p);
}
}
*Maksud dari script berwarna merah diatas yakni kita membuat parameter string $u dan $p untuk memproses inputan username dan password.
*Disana terdapat
model_login yang berfungsi untuk memproses login dan memanggil database serta mencocokannya. Oke untuk lebih mudah kita buat modelnya.
- Cara nya dengan klik kanan pada folder model, lalu pilih new file dan buat nama
model_login.php
Berikut script
model_login
<?php
defined('BASEPATH') OR exit('No direct script access allowed');
class Model_login extends CI_model {
public function getlogin($u,$p)
{
$this->db->where('username',$u);
$this->db->where('password',$p);
$query = $this->db->get('admin');
if($query->num_rows()>0)
{
foreach ($query->result() as $row)
{
$sess = array('username' => $row->username,
'password' => $row->password);
$this->session->set_userdata($sess);
redirect('home');
}
}
else
{
$this->session->set_flashdata('info','maaf data tidak valid');
redirect('login');
}
}
}
*Perhatikan script berwarna merah itu merupakan aksi apabila pada saat login memasukan username dan password tidak sesuai dengan database maka akan muncul informasi tersebut. Nah dimana informasi tersebut muncul?
Oke kalian buka lagi view tampilan_login dan fokuskan pada script
<input type="password" name="password" id="password" class="form-control" placeholder="Password" />
Lalu kalian enter dan masukan script berikut tepat dibawah script diatas
<?php
$info= $this->session->flashdata('info');
if(!empty($info))
{
echo $info;
}
?>
*Script diatas berfungsi untuk menampilkan pesan info yang tadi sudah kita buat pada script berwarna merah. Jika kalian bingung begini penampakan script diatas.
Oittt,, sebelum anda kembali ke browser. Ada lagi ini untuk mempercantik tampilan. Kalian buka view tampilan_login dan perhatikan script berikut :
<form method="POST" action="<?php echo base_url();?>index.php/login/getlogin" onsubmit="return cekform();">
diatas sudah saya jelaskan bahwa fungsi cekform untuk memastikan form username dan password harus di isi. Atau seperti ini tampilannya biar jelas..
Caranya dengan anda cari diatas scrip </head> lalu letakan percis diatas script tersebut
<script type="text/javascript">
function cekform()
{
if(!$("#username").val())
{
alert ('Maaf username tidak boleh kosong');
$("#username").focus();
return false
}
if(!$("#password").val())
{
alert ('Maaf password tidak boleh kosong');
$("#password").focus();
return false
}
}
</script>
Atau jika anda bingung perhatikan gambar berikut untuk memastikan posisi :
Oke sudah selesai proses kodingnya.. Untuk mengingatkan, kalian lihat kembali models model_login dan perhatikan script berikut
$query = $this->db->get('admin');
script berikut adalah memanggil tabel admin dari database keluhan yang sudah dibuat pada proses konfigurasi.. Seperti berikut :
Karena saya belum membuat proses registrasi pada tampilan web. Maka kita harus insert username dan password secara manual. Jika kalian sudah insert username dan password. Maka kita buka browser kita dan jalankan kembali tampilan login.. Berikut output :
1. Tampilan Login
2. Tampilan Validasi jika username dan password kosong
3. Tampilan jika username dan password salah
Dan apabila username dan password yang dimasukan benar, maka akan tampil seperti ini :
Mengapa Not Found? Karena kita belum membuat controllers home yang berisi view atau tampilannya. Nanti akan saya buat pada artikel selanjutnya. Cukup sekian informasi yang bisa saya bagikan mengenai proses login dengan menggunakan codeigniter dan database MySQL semoga bermanfaat. Salam sukses !!!
