Web Programminng 2 Pertemuan 10 Membuat Form Registrasi User
Nama : Abdan Ardiansyah
Nim : 11190456
Kelas : 11.3A.02
Membuat helper
File helper ini dibuat untuk membuat pengecekan status login dari user. Karena akan digunakan disetiap form, agar lebih efektif maka dibuatlah helper. Aturan penamaan file helper ini harus diakhiri dengan kata helper contoh booking_helper.php, pustaka_helper.php dan lain-lain. Ketika helper ini akan digunakan atau di load, pemanggilannya cukup kata depannya saja. Seperti contoh helper diatas yaitu diload booking dan pustaka tanpa menyertakan kata _helper nya.
Buatlah file baru beri nama pustaka_helper.php kemudian simpan dalam folder
application/helpers dan berikut script dari pustaka_helper.php:
application/helpers dan berikut script dari pustaka_helper.php:
<?php
function cek_login()
{
$ci = get_instance();
if (!$ci->session->userdata('email')) {
$ci->session->set_flashdata('pesan', '<div class="alert
alert-danger" role="alert">Akses ditolak. Anda belum login!!
</div>');
redirect('autentifikasi');
} else {
$role_id = $ci->session->userdata('role_id');
}
}
Dari tampilan script di atas, terlihat ada duan function yaitu cek_login() untuk memastikan sudah login atau belum.
Selanjutnya buat file view blok.php dan gagal.php kedua file ini digunakan untuk menampilkan tampilan gagal dan akses di blok. Untuk membuatnya kita bisa menggunakan template yang sudah disediakan oleh sb admin 2. Cari file 404.html kemudian buka dengan edior lalu copy isi scriptnya dan paste pada file blok.php dan file gagal.php. selanjutnya samakan scriptnya seperti berikut:
blok.php
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initialscale=1, shrink-to-fit=no">
<meta name="description" content="">
<meta name="author" content="">
<title>Akses diblock </title>
<!-- Custom fonts for this template-->
link href="<?= base_url('assets/');?>
vendor/fontawesomefree/css/all.min.css" rel="stylesheet" type="text/css">
<link
href="https://fonts.googleapis.com/css?family=Nunito:200,200i,300,30
0i,400,400i,600,600i,700,700i,800,800i,900,900i" rel="stylesheet">
<!-- Custom styles for this template-->
<link href="<?= base_url('assets/');?>css/sb-admin-2.min.css"
rel="stylesheet">
</head>
<body id="page-top">
<!-- Page Wrapper -->
<div id="wrapper">
<!-- Content Wrapper -->
<div id="content-wrapper" class="d-flex flex-column">
<!-- Main Content -->
<div id="content">
<!-- Begin Page Content -->
<div class="container-fluid mt-5">
<!-- 404 Error Text -->
<div class="text-center">
<div class="error mx-auto" data-text="403">403</div>
<p class="lead text-gray-800 mb-5">Akses tidak
diizinkan</p>
<p class="text-gray-500 mb-0">Sepertinya kamu megakses
halaman yang salah</p>
<a href="<?= base_url('user');?>">← Kembali ke
Dashboard</a>
</div>
</div>
<!-- /.container-fluid -->
</div>
<!-- End of Main Content -->
</div>
<!-- End of Content Wrapper -->
</div>
<!-- End of Page Wrapper -->
<!-- Scroll to Top Button-->
<a class="scroll-to-top rounded" href="#page-top">
<i class="fas fa-angle-up"></i>
</a>
<!-- Logout Modal-->
<div class="modal fade" id="logoutModal" tabindex="-1"
role="dialog" aria-labelledby="exampleModalLabel" ariahidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Ready to
Leave?</h5>
<button class="close" type="button" data-dismiss="modal"
aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">Select "Logout" below if you are
ready to end your current session.</div>
<div class="modal-footer">
<button class="btn btn-secondary" type="button" datadismiss="modal">Cancel</button>
<a class="btn btn-primary" href="login.html">Logout</a>
</div>
</div>
</div>
</div>
<!-- Bootstrap core JavaScript-->
<script src="<?=
base_url('assets/');?>vendor/jquery/jquery.min.js"></script>
<script src="<?=
base_url('assets/');?>vendor/bootstrap/js/bootstrap.bundle.min.js"><
/script>
<!-- Core plugin JavaScript-->
<script src="<?= base_url('assets/');?>vendor/jqueryeasing/jquery.easing.min.js"></script>
<!-- Custom scripts for all pages-->
<script src="<?= base_url('assets/');?>js/sb-admin-
2.min.js"></script>
</body>
</html>
gagal.php
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initialscale=1, shrink-to-fit=no">
<meta name="description" content="">
<meta name="author" content="">
<title>Gagal Aktifasi Akun </title>
<!-- Custom fonts for this template-->
<link href="<?= base_url('assets/'); ?>vendor/fontawesomefree/css/all.min.css" rel="stylesheet" type="text/css">
<link
href="https://fonts.googleapis.com/css?family=Nunito:200,200i,300,30
0i,400,400i,600,600i,700,700i,800,800i,900,900i" rel="stylesheet">
<!-- Custom styles for this template-->
<link href="<?= base_url('assets/'); ?>css/sb-admin-2.min.css"
rel="stylesheet">
</head>
<body id="page-top">
<!-- Page Wrapper -->
<div id="wrapper">
<!-- Content Wrapper -->
<div id="content-wrapper" class="d-flex flex-column">
<!-- Main Content -->
<div id="content">
<!-- Begin Page Content -->
<div class="container-fluid mt-5">
<!-- 404 Error Text -->
<div class="text-center">
<?= $this->session->flashdata('pesan'); ?>
<a href="<?= base_url('autentifikasi'); ?>"
class="btn btn-secondar y ">← Close </a>
</div>
</d iv>
<!-- /.contai n er-fluid -->
</div>
<!--End of Main Content -->
</div>
<!--End of Content Wrapper -->
</div>
<!--End of Page Wrap per -->
<!--Scroll to Top Button -->
<a class="scroll-to-top rounded" href="#page-top"><i
class="fas fa-angle-up"></i></a>
<!-- Bootstrap core JavaScript -->
<script src="<?= base_url('assets/');
?>vendor/jquery/jquery.min .js"></script>
<script src="<?= base_url('assets/');
?>vendor/bootstrap/js/bootstrap.bundle.min.j s"></script>
<!-- Core plugin JavaScript -->
<script src="<?= base_url('assets/'); ?>vendor/jqueryeasing/jquery.easing.min.j s"></script>
<!-- Custom scripts for all pages-->
<script src="<?= base_url('assets/'); ?>js/sb-admin-
2.min.js"></script>
<script>
$('.alert-message').alert().delay(3500).slideUp('slow');
</script>
</body>
</html>
Selanjutnya tambahkan method untuk mengontrol blok.php dan gagal php di atas dalam controller autentifikasi.php berikut scriptnya
public function blok()
{
$this->load->view('autentifikasi/blok');
}
public function gagal()
{
$this->load->view('autentifikasi/gagal');
}
Membuat Form Registrasi
Setelah membuat tampilan-tampilan blok dan gagal. Barulah membuat tampilan registrasi. Buatlah view baru beri nama registrasi.php kemudian simpan dalam folder
Application/views/autentifikasi lalu buka file view login.php copy semua script login dan paste pada file registrasi.php. Selanjutnya tambahkan inputan sehingga hasilnya seperti berikut:
Application/views/autentifikasi lalu buka file view login.php copy semua script login dan paste pada file registrasi.php. Selanjutnya tambahkan inputan sehingga hasilnya seperti berikut:
<div class="container">
<div class="card o-hidden border-0 shadow-lg my-5 col-lg-7 mxauto">
<div class="card-body p-0">
<!-- Nested Row within Card Body -->
<div class="row">
<div class="col-lg">
<div class="p-5">
<div class="text-center">
<h1 class="h4 text-gray-900 mb-
4">Daftar Menjadi Member!</h1>
</div>
<form class="user" method="post"
action="<?= base_url('autentifikasi/registrasi'); ?>">
<div class="form-group">
<input type="text" class="formcontrol form-control-user" id="nama" name="nama" placeholder="Nama
Lengkap" value="<?= set_value('nama'); ?>">
<?= form_error('nama', '<small
class="text-danger pl-3">', '</small>'); ?>
</div>
<div class="form-group">
<input type="text" class="formcontrol form-control-user" id="email" name="email"
placeholder="Alamat Email" value="<?= set_value('email'); ?>">
<?= form_error('email', '<small
class="text-danger pl-3">', '</small>'); ?>
</div>
<div class="form-group row">
<div class="col-sm-6 mb-3 mb-sm-
0">
<input type="password"
class="form-control form-control-user" id="password1"
name="password1" placeholder="Password">
<?= form_error('password1',
'<small class="text-danger pl-3">', '</small>'); ?>
</div>
<div class="col-sm-6">
<input type="password"
class="form-control form-control-user" id="password2"
name="password2" placeholder="Ulangi Password">
<?= form_error('password2',
'<small class="text-danger pl-3">', '</small>'); ?>
</div>
</div>
<button type="submit" class="btn btnprimary btn-user btn-block">
Daftar Menjadi Member
</button>
</form>
<hr>
<div class="text-center">
<a class="small" href="<?=
base_url('autentifikasi/lupaPassword'); ?>">Lupa Password?</a>
</div>
<div class="text-center">
Sudah Menjadi Member?<a class="small"
href="<?= base_url('autentifikasi'); ?>"> Login!</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
Selanjutnya setelah membuat view registrasi. Kita tambahkan method pada controller autentifikasi. Nama methodnya registrasi() seperti berikut:
public function registrasi()
{
if ($this->session->userdata('email')) {
redirect('user');
}
//membuat rule untuk inputan nama agar tidak boleh kosong
dengan membuat pesan error dengan
//bahasa sendiri yaitu 'Nama Belum diisi'
$this->form_validation->set_rules('nama', 'Nama Lengkap',
'required', [
'required' => 'Nama Belum diis!!'
]);
//membuat rule untuk inputan email agar tidak boleh kosong,
tidak ada spasi, format email harus valid
//dan email belum pernah dipakai sama user lain dengan
membuat pesan error dengan bahasa sendiri
//yaitu jika format email tidak benar maka pesannya 'Email
Tidak Benar!!'. jika email belum diisi,
//maka pesannya adalah 'Email Belum diisi', dan jika email
yang diinput sudah dipakai user lain,
//maka pesannya 'Email Sudah dipakai'
$this->form_validation->set_rules('email', 'Alamat Email',
'required|trim|valid_email|is_unique[user.email]', [
'valid_email' => 'Email Tidak Benar!!',
'required' => 'Email Belum diisi!!',
'is_unique' => 'Email Sudah Terdaftar!'
]);
//membuat rule untuk inputan password agar tidak boleh
kosong, tidak ada spasi, tidak boleh kurang dari
//dari 3 digit, dan password harus sama dengan repeat
password dengan membuat pesan error dengan
//bahasa sendiri yaitu jika password dan repeat password
tidak diinput sama, maka pesannya
//'Password Tidak Sama'. jika password diisi kurang dari 3
digit, maka pesannya adalah
//'Password Terlalu Pendek'.
$this->form_validation->set_rules('password1', 'Password',
'required|trim|min_length[3]|matches[password2]', [
'matches' => 'Password Tidak Sama!!',
'min_length' => 'Password Terlalu Pendek'
]);
$this->form_validation->set_rules('password2', 'Repeat
Password', 'required|trim|matches[password1]');
//jika jida disubmit kemudian validasi form diatas tidak
berjalan, maka akan tetap berada di
//tampilan registrasi. tapi jika disubmit kemudian validasi
form diatas berjalan, maka data yang
//diinput akan disimpan ke dalam tabel user
if ($this->form_validation->run() == false) {
$data['judul'] = 'Registrasi Member';
$this->load->view('templates/aute_header', $data);
$this->load->view('autentifikasi/registrasi');
$this->load->view('templates/aute_footer');
} else {
$email = $this->input->post('email', true);
$data = [
'nama' => htmlspecialchars($this->input-
>post('nama', true)),
'email' => htmlspecialchars($email),
'image' => 'default.jpg',
'password' => password_hash($this->input-
>post('password1'), PASSWORD_DEFAULT),
'role_id' => 2,
'is_active' => 0,
'tanggal_input' => time()
];
$this->ModelUser->simpanData($data); //menggunakan model
$this->session->set_flashdata('pesan', '<div
class="alert alert-success alert-message" role="alert">Selamat!!
akun member anda sudah dibuat. Silahkan Aktivasi Akun anda</div>');
redirect('autentifikasi');
}
}
Setelah controller dibuat, selanjutnya buatlah sebuah model baru beri nama ModelUser.php kemudian simpan dalam folder Application/models/ lalu buatlah script di bawah:
<?php
defined('BASEPATH') or exit('No direct script access allowed');
class ModelUser extends CI_Model
{
public function simpanData($data = null)
{
$this->db->insert('user', $data);
}
public function cekData($where = null)
{
return $this->db->get_where('user', $where);
}
public function getUserWhere($where = null)
{
return $this->db->get_where('user', $where);
}
public function cekUserAccess($where = null)
{
$this->db->select('*');
$this->db->from('access_menu');
$this->db->where($where);
return $this->db->get();
}
public function getUserLimit()
{
$this->db->select('*');
$this->db->from('user');
$this->db->limit(10, 0);
return $this->db->get();
}
}
Membuat Halaman My Profile dan Ubah Profile
Halaman my profile ini akan di tampilkan setelah login. Link unutk mengaksesnya berada di pojok kanan atas tampilan halaman utama admin.
Buatlah controller baru beri nama User.php kemudian simpan dalam folder Application/controlles/ lalu buatlah script berikut:
<?php
defined('BASEPATH') or exit('No direct script access allowed');
class User extends CI_Controller
{
public function __construct()
{
parent::__construct();
cek_login();
}
public function index()
{
$data['judul'] = 'Profil Saya';
$data['user'] = $this->ModelUser->cekData(['email' => $this-
>session->userdata('email')])->row_array();
$this->load->view('templates/header', $data);
$this->load->view('templates/sidebar', $data);
$this->load->view('templates/topbar', $data);
$this->load->view('user/index', $data);
$this->load->view('templates/footer');
}
public function anggota()
{
$data['judul'] = 'Data Anggota';
$data['user'] = $this->ModelUser->cekData(['email' => $this-
>session->userdata('email')])->row_array();
$this->db->where('role_id', 1);
$data['anggota'] = $this->db->get('user')->result_array();
$this->load->view('templates/header', $data);
$this->load->view('templates/sidebar', $data);
$this->load->view('templates/topbar', $data);
$this->load->view('user/anggota', $data);
$this->load->view('templates/footer');
}
public function ubahProfil()
{
$data['judul'] = 'Ubah Profil';
$data['user'] = $this->ModelUser->cekData(['email' => $this-
>session->userdata('email')])->row_array();
$this->form_validation->set_rules('nama', 'Nama Lengkap',
'required|trim', [
'required' => 'Nama tidak Boleh Kosong'
]);
if ($this->form_validation->run() == false) {
$this->load->view('templates/header', $data);
$this->load->view('templates/sidebar', $data);
$this->load->view('templates/topbar', $data);
$this->load->view('user/ubah-profile', $data);
$this->load->view('templates/footer');
} else {
$nama = $this->input->post('nama', true);
$email = $this->input->post('email', true);
//jika ada gambar yang akan diupload
$upload_image = $_FILES['image']['name'];
if ($upload_image) {
$config['upload_path'] = './assets/img/profile/';
$config['allowed_types'] = 'gif|jpg|png';
$config['max_size'] = '3000';
$config['max_width'] = '1024';
$config['max_height'] = '1000';
$config['file_name'] = 'pro' . time();
$this->load->library('upload', $config);
if ($this->upload->do_upload('image')) {
$gambar_lama = $data['user']['image'];
if ($gambar_lama != 'default.jpg') {
unlink(FCPATH . 'assets/img/profile/' .
$gambar_lama);
}
$gambar_baru = $this->upload->data('file_name');
$this->db->set('image', $gambar_baru);
} else { }
}
$this->db->set('nama', $nama);
$this->db->where('email', $email);
$this->db->update('user');
$this->session->set_flashdata('pesan', '<div
class="alert alert-success alert-message" role="alert">Profil
Berhasil diubah </div>');
redirect('user');
}
}
}
kemudian setelah membuat controller, selanjutnya kita buat tampilan (view ) dari my profile dan ubah profile.
Buatlah file view baru beri nama index.php dan ubah-profile.php lalu simpan dalam folder
Application/views/user/ kemudian buatlah script berikut:
Application/views/user/ kemudian buatlah script berikut:
Index.php
<!-- Begin Page Content -->
<div class="container-fluid">
<div class="row">
<div class="col-lg-6 justify-content-x">
<?= $this->session->flashdata('pesan'); ?>
</div>
</div>
<div class="card mb-3" style="max-width: 540px;">
<div class="row no-gutters">
<div class="col-md-4">
<img src="<?= base_url('assets/img/profile/') .
$user['image']; ?>" class="card-img" alt="...">
</div>
<div class="col-md-8">
<div class="card-body">
<h5 class="card-title"><?= $user['nama'];
?></h5>
<p class="card-text"><?= $user['email']; ?></p>
<p class="card-text"><small class="textmuted">Jadi member sejak: <br><b><?= date('d F Y',
$user['tanggal_input']); ?></b></small></p>
</div>
<div class="btn btn-info ml-3 my-3">
<a href="<?= base_url('user/ubahprofil'); ?>"
class="text text-white"><i class="fas fa-user-edit"></i> Ubah
Profil</a>
</div>
</div>
</div>
</div>
</div>
<!-- /.container-fluid -->
</div>
<!-- End of Main Content -->
ubah-profile.php
<!-- Begin Page Content -->
<div class="container-fluid">
<div class="row">
<div class="col-lg-9">
<?= form_open_multipart('user/ubahprofil'); ?>
<div class="form-group row">
<label for="email" class="col-sm-2 col-formlabel">Email</label>
<div class="col-sm-10">
<input type="text" class="form-control"
id="email" name="email" value="<?= $user['email']; ?>" readonly>
</div>
</div>
<div class="form-group row">
<label for="nama" class="col-sm-2 col-formlabel">Nama Lengkap</label>
<div class="col-sm-10">
<input type="text" class="form-control"
id="nama" name="nama" value="<?= $user['nama']; ?>">
<?= form_error('nama', '<small class="textdanger pl-3">', '</small>'); ?>
</div>
</div>
<div class="form-group row">
<div class="col-sm-2">Gambar</div>
<div class="col-sm-10">
<div class="row">
<div class="col-sm-3">
<img src="<?=
base_url('assets/img/profile/') . $user['image']; ?>" class="imgthumbnail" alt="">
</div>
<div class="col-sm-9">
<div class="custom-file">
<input type="file" class="customfile-input" id="image" name="image">
<label class="custom-file-label"
for="image">Pilih file</label>
</div>
</div>
</div>
</div>
</div>
<div class="form-group row justify-content-end">
<div class="col-sm-10">
<button type="submit" class="btn btnprimary">Ubah</button>
<button class="btn btn-dark"
onclick="window.history.go(-1)"> Kembali</button>
</div>
</div>
</form>
</div>
</div>
</div>
<!-- /.container-fluid -->
</div>
<!-- End of Main Content -->
Komentar
Posting Komentar