welcome to my blog

welcome to my blog !! Enjoy :)

Minggu, 13 Januari 2013

Session pada login di CI

Listing


Listing Program


Controller Login.php
<?php
Class Login extends CI_Controller {
//constructor
public function __construct(){
parent::__construct();
$this->load->helper('url');
$this->load->helper('form');
$this->load->library('form_validation');
$this->load->library('session'); }
//index for showing the login form
function index() {
$this->load->view('login_view');}
//this function will do the login process
function proseslogin() {
$username = $this->input->post('username');
$password = $this->input->post('password');
$passwordx = md5($password);
//the query is to matching the username+password user with username+password from database
$q = $this->db->query("SELECT * FROM tb_user WHERE username='$username' AND userpass='$passwordx'");
if ($q->num_rows() == 1) {
// if the query is TRUE, then save the username into session and load the welcome view
$nama = $q->row()->username;
$this->session->set_userdata('username',$nama);
$data['welcome'] = "Welcome $nama";
$this->load->view('welcome_view', $data);}
else {
// query error
$data['error']='!! Wrong Username or Password !!';
$this->load->view('login_view', $data);}}
//to do logout process
function logout() {
$this->session->sess_destroy();
$data['logout'] = 'You have been logged out.';
$this->load->view('login_view', $data);}}
?>
Model akun.php
<?php
Class ModelAkun extends CI_Model {
function __construct() {
parent::__construct(); } f
function cekUserPass($username, $password) {
$this->db->where('username', $username);
$this->db->where('password', $password);
$query = $this->db->get('user');
return $query->num_rows() > 0;}
function isLogin() {
return $this->session->userdata('username');}}
?>
View login_view.php
<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html><head>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
<title>Login with CI</title>
<center>
<h2> <b> Login with CI </b> <h2>
<?php echo form_open('login/proseslogin'); ?>
<table border="0" align="center">
<tr>
<td> Username</td>
<td> <input name="username" type="text"> </td>
</tr>
<tr>
<td> Password</td>
<td> <input name="password" type="password"> </td>
</tr><tr>
<td> &nbsp; </td>
<td> <input name="submit" type="submit" value="login"> </td>
</tr>
</table>
</form>
<?php if(isset($error)) echo "<b><span style='color:red;'>$error</span></b>";
if(isset($logout)) echo "<b><span style='color:red;'>$logout</span></b>"; ?>
</center>
</body></html>
View  Welcome_view.php
<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html><head>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
<title>Login with CI</title>
<center>
<?php if(isset($welcome)) echo "<h2><span style='color:red;'>$welcome</span></h2>";
echo "<br/>";
echo anchor("login/logout", 'Logout') ?>
</center>
</body></html>

Database


Output















kali ini kita akan membuat session pada CI. Session adalah sebuah varibel sementara yang diletakkan di server. Di mana PHP bisa mengambil nilai yang tersimpan di server walaupun kita membuka halaman baru. Biasanya session akan hilang jika kamu menutup browser.
Sebelum kamu menggunakan fungsi – fungsi tentang session di CI kamu hrus memanggil library session terlebih dahulu dengan cara :
$this->load->library('session');
Selanjutnya cara kita membuat atau memasukan nilai ke variabel sementara atau session :
$this->session->set_userdata('some_name', 'some_value');
            Yang kita lakukan pertama kali adalah membuat database untuk  session in dahulu yang berguna untuk menyimpan nama admin yang dapat login ke dalah suatu halaman website. Kita menyimpannya ke dalam database login.  Dari database kita menggunakan tabel login dan kita isi field dengan id yang bertipa data integer dengan auto increment, nama dengan tipe data char dan password dengan tipe data char lalu di enkripsi dengan algoritma md5. Gunanya enkripsi ini adalah agar pihak lain tidak ada yang mengetahui password si admin ynang mendaftar selain  admin itu sendiri . Lalu, kita isi dengan nama admin yaitu user dan password risma.
            Setelah itu kita masuk ke pemrogramannya. Pertama kita akan masuk ke controller login.php. Didalam function index terdapat perintah $this->load->view(‘login_view’); yang berarti bahwa akan memanggil file login_view.php di folder view. Di dalam login view hanya terdapat tulisan Login With Ci dan form untuk username dan submit serta button login. Dan jika kita klik button login maka akan menuju ke <?php echo form_open('login/proseslogin'); ?> akan ke controller login dan function proses login.
            Di dalam function proseslogin terdapat $username = $this->input->post('username'); // untuk membaca isian dari database login dan tabel login dengan field username. $password = $this->input->post('password'); //untuk membaca isian dari database login dan tabel login dengan field password yang diisikan oleh user. $passwordx = md5($password); // perintah ini untuk mengganti $password menjadi enkripsi dengan algoritma MD5. $q = $this->db->query("SELECT * FROM tb_user WHERE username='$username' AND userpass='$passwordx'"); perintah ini untuk mencocokkan username dan password isian admin dengan record yang username dan password yang tersimpan di dalam database.if ($q->num_rows() == 1) { Jika query benar dan username tersimpan di dalam session kemudian akan memanggil welcome view. $nama = $q->row()->username; $this->session->set_userdata('username',$nama); $data['welcome'] = "Welcome $nama"; dengan nama Welcome dan nama admin. $this->load->view('welcome_view', $data); Peintah ini untuk memanggil welcome view.php di view else { jika data yang di masukkan tidak cocok maka akan ke perintah berikut $data['error']='!! Wrong Username or Password !!'; Menghasilkan tulisan !! Wrong Username or Password !!
            Setelah terpanggil, maka kita akan ke welcome_view. Di dlaam welcome view hanya aka nada tulisan Welcome nama admin. Dan logout yang jika di klik maka akan ke controller Login dan function logout. $this->session->sess_destroy(); session dimatikan $data['logout'] = 'You have been logged out.'; perintah ini akan memunculkan tulisan 'You have been logged out. $this->load->view('login_view', $data); Lalu, perintah ini untuk menampilkan login_view


Contoh Jquery





Kali ini kita akan membuat sebuah HTML yang berisi JQuery. Pengertian JQuery adalah sebuah framework berbasiskan Javascript. JQuery sama dengan Javascript Library yaitu kumpulan kode atau fungsi Javascript siap pakai, sehingga mempermudah dan mempercepat kita dalam membuat kode Javascript.Hal yang menarik dari JQuery adalah penekanan interaksi antara Javascript dan HTML. JQuery pertama kali dirilis pada tahun 2006 oleh John Resig. JQuery memiliki slogan “Write less, do more” yang artinya kesederhanaan dalam penulisan code, tapi dengan hasil yang lebih banyak. 
Logika dari program di atas adalah kita masuk ke dalah html. Kita menggunakan jquery yang embeded artinya adalah tertempel pada html tersebut. Tags <html> dan <head> seperti penjelasan sebelumnya. Lalu, kita masuk ke dalam script javascript nya. Dengan codingan <script type="text/javascript" src="jquery.js"></script>.  Di dalam tags script adalah untuk membuat animasi untuk bias menghilang setengah menghilang dan ada.
Lalu, kita masuk ke script $("document").ready(function(). Tand $ adalah sebagai tanda kita akan memasuki script dari JQuery. Ini berarti kita akan membuat sebuah function untuk document dan ditulis dalam bahasa jQuery.
$(".fadeout").click(function(){ $("#kotak").fadeOut("slow") Kita masuk le dalam function fadeout. Yang artinya jika kita klik fadeout maka kotak akan muncul dengan lambat.  });$(".fadein").click(function(){ $("#kotak").fadeIn("slow") Lalu, jika kita klik fadein maka kotak akan menghilang.});$(".fadeto3").click(function(){
$("#kotak").fadeTo("slow",0.3); Dan terakhir jika kita klik fadeto3 maka kotak akan tampil setengah atau seperti berbayang.
            Setelah itu, kita keluar dari scrip jQuery, dan selanjutnya kita masuk kedalam script css
<style type="text/css">
#kotak{
            width:250px;
            height:180px;
            background:yellow;
            border:2px solid black;}
</style>
            Perintah di atas adalah perintah untuk membuat function kotak yang akan dipanggil dalam file html ataupun jQuery dengan #kotak. Dengan lebar 250 px dan panjang 180 px dan kotak berwarna kuning serta garis tepi berwarna hitam solid.
            Dan yang terakhir adalah untuk file html nya yaitu program utama dari web ini. Perintah yang kita masukkan adalah sebagai berikut
<title>Efek Fade In, Fade Out, dan Fade To</title>
 </head>
 <body>
 <div id="kotak"></div><br>
  <button class="fadeout">Fade Out</button>
  <button class="fadein">Fade In</button>
  <button class="fadeto3">Fade To 0.3</button>
 </body>
</html>
            Judul yang kita berikan adalah Efek Fade In, Fade Out, dan Fade To. Lalu, pada body kita akan membuat div kotak yang akan di panggil di file css dan jQuery nya. Disini, kita akan membuat 3 button yaitu Fade Out yang jika di klick maka akan memanggil fungsi fadeout pada script jQuery di atas. Jika kita klik button Fade In, maka akan memanggil fungsi fadein di jQuery begitupun untuk fade To 0.3 akan memanggil fungsi fadeto3 dengan aksi di dalamnya.

Membuat ganjil genap menggunakan CI





                                                                                        
Listing ganjilgenap


Sekarang kita akan membuat web dengan menggunakan bantusan js atau javascript. JavaScript adalah bahasa scripting dari Web. JavaScript digunakan dalam milyaran halaman web untuk menambahkan fungsionalitas, memvalidasi bentuk, berkomunikasi dengan server, dan banyak lagi. JavaScript adalah bahasa pemrograman berbasis prototipe yang berjalan disisi klien. jika kita berbicara dalam konteks web, sederhananya, kita dapat memahami JavaScript sebagai bahasa pemrograman yang berjalan di browser.
Javascript dipanggil untuk memberikan fungsi pada halaman web dengan meletakannya secara internal pada halaman html diantara tag <script> </script> atau dibuat pada file terpisah ( eksternal ) dan lalu di link menggunakan <link rel=”" href=”"> pada bagian <head>. Secara fungsional, Javascript digunakan untuk menyediakan akses script pada objek yang dibenamkan ( embedded ). Contoh sederhana dari penggunaan javascript adalah membuka halaman pop up, fungsi validasi pada form sebelum data dikirimkan ke server, merubah image kursor ketika melewati objek tertentu, dan lain lain.
Kali ini, kita akan membuat fungsi javascript internal yaitu javascript yang di tempel di html. Pertama, kita lihat terlebih dahulu pemrograman html pada angka. Disana, di maksudkan kita untuk memasukkan sebuah angka maka akan di deteksi apakah angka tersebut termasuk kedalam bilangan ganjil atau genap.
<html>
<head> </head>
<SCRIPT 1anguage="Javascript">
function test(){
var vall=document.kirim.T1.value
if (vall%2==0)
   document.kirim.T2.value="bilangan genap"
else
   document.kirim.T2.value="bilangan ganjil"
}
</SCRIPT>
<body>
<form method="POST" name="kirim">
<p>BIL <input type="text" name="T1" size="20">
MERUPAKAN <input type="text" name="T2" size="20">
</p>
<p><input type="button" value="TEBAK" name="B1" onclick=test()>
</p>
</form>
</body>
</html>
Untuk koding angka di atas kita lihat bahwa fungsi js dimulai dari <SCRIPT 1anguage="Javascript"> yang merupakan penanda awal bahwa fungsi js internal akan dipakai. Lalu, kita memasukkan function untuk fungsi dari js tersebut. Disini hanya ada satu function yaitu function test. Di dalam function test akan di adakan perhitungan untuk menentukan apakah suatu bilangan termasuk ke dalam bilangan genap atau ganjil.  Untuk lebih jelasnya, sebaiknya kita jelaskan dari program utama terlebih dahulu.
Pertama kita masuk pada form method dengan nama kirim dan jenis POST. Lalu, disana kita akan mencetak kata BIL dan user di haruskan mengisi suatu form dengan tipe input type yang berarti terserah user menginput angka dan angka tersebut akan muncul dengan ukuran 20 dan disimpan dalam variabel T1. Selanjutnya menetak kata MERUPAKAN dan disediakan seuah form untuk hasil output bilangan tersebut apakah ganjil atau genap.

Lalu, kita akan membuat button dengan nama TEBAK dan variabel B1. Lalu, jika di klik button tersebut maka kita akan memanggil function test()  ini dari kata onClick yang berarti jika di klik akan menjalankan perintah sesuai value nya.  Lalu, kita masuk ke function test. Pertama kita deklarasikan var vall=document.kirim.T1.value yang berarti variabel vall akan berisi document.kirim.T1.value yang artinya variabel vall berisi nilai inputan yang akan di input user. Lalu, masuk ke percabangan, disini yang akan menentukan bilangan tersebut genap atau ganjil. Jika vall mod 2=0 maka bilangan tersebut genap dan lainnya adalah ganjil.

Selanjutnya, kita akan masuk ke program yang kedua yaitu angka. Disini, kita akan merubah background atau juga warna dari tulisan atau teks. Kita akan langsung bahas ke js nya saja. Soalnya sintaks html nya logikanya sama dengan program sebelumnya. function ubahWarnaLB(warna){ document.bgColor=warna;kita membuat function ubahWarnaLB(warna) untuk backgroud. Warna dimaksudkan untuk prototype. Document.bgColor=warna adalah kita mengatur warna background adalah variabel warna yang isinya akan ada pada saat input type sebagai berikut. <input type="button" value="latar belakang warna hijau" onclick="ubahWarnaLB('GREEN')"> Saat button di klik maka warna berubah menjadi hilau karena prototype yang digunakan adalah GREEN. document.write("dimodifikasi terakhir pada "+document.lastModified); ini adalah untuk mencetak di modifikasi terakhir pada ditambah tanggal serta waktu mengikuti komputernya masing-masing.
Lalu, yang terakhir adalah program shadow. <textarea rows="12" name="wordcount2" cols="38" wrap="virtual" onkeypress="hitung()"></textarea><br> <textarea rows="12" name="wordcount3" cols="38" wrap="virtual" onkeypress="hitung()"></textarea><br>. Disini hanya menggunakan sedikit sintaks yaitu teks area sebagai input dan output program. Text area pertama dengan panjang 38 kolom dan lebar 12 baris. Dengan nama wordcount2 dan jika diketikkan maka akan melaksanakan perintah function hitung yang isinya adalah document.wordcount.wordcount3.value=document.wordcount.wordcount2.value; isi atau inputan dari document 2 atau text area 1 akan disimpan dan ditampilkan di wordcount3 atau text area2.