CodeIgniter – Apa itu ?
Simple Login Ajax Jquery Mysql dan JSON dengan PHP
hi. kali ini gw mau sharing bagaimana cara membuat simple login dengan menggunakan post via ajax jquery yang nantinya akan kita tampilkan hasil dengan menggunakan format JSON
Persiapan Database
Persiapan struktur folder,
keterangan file :
1. index.php => form login untuk tampilan awalnya
diantara Tag <body></body> copy paste kode element berikut :
"<input type="text" id="username" placeholder="username"> <br>
<input type="password" id="password" placeholder="password"><br>
<button type="button" id="btn-login"> Login</button>"
jika di jalankan pada browser maka tampilan akan menjadi seperti gambar berikut :
Tambahkan sebuah javascript untuk menjalankan ajax, script yg kita gunakan adalah script online yang ada di code.jquery.com
<script type="text/javascript" src="http://code.jquery.com/jquery-3.2.1.min.js"></script>
Lalu Tambahkan script dimana script ini akan menjalankan proses ajax
<script type="text/javascript">
$(document).ready(function(){
$('#btn-login').click(function(){
var bangtiray={
username : $('#username').val(),
password : $('#password').val(),
}
$.ajax({
url:"login.php",
type:"POST",
data: bangtiray,
success:function(data){
var obj= $.parseJSON(data);
if(obj.status===1){
//ini akan mnampilkan pesan yang berhasil
//alert(obj.error);
window.open('home.php','_self');
}else{
//ini akan mnampilkan pesan kolom kosong
alert(obj.error);
}
}
})
})
})
</script>
2. Script file koneksi.lib.php
<?php
$host="localhost";
$user="root";
$pass="";
$database="latihan";
$conn = mysqli_connect($host , $user, $pass, $database) or die(mysqli_connect_error());
?>
3. script file login.php
<?php
session_start();
include('koneksi.lib.php');
$username = $_POST['username'];
$password = $_POST['password'];
if($username=="" || $password==""){
$status['status']=0; //bernilai salah
$status['error']="Mohon Input Kolom Kosong";
}else{
$sql='SELECT * FROM sys_user where username="'.$username.'" and password="'.sha1($password).'"';
$query=mysqli_query($conn, $sql) or ("error");
$row = mysqli_fetch_array($query);
$_SESSION['username']=$row["full_name"];
$status['status']=1; //bernilai benar
$status['error']="Berhasil Login dengan username " . $username;
}
echo json_encode($status);
?>
4. script home.php dimana file ini akan menampilkan session nama user
<!DOCTYPE html>
<html>
<head>
<title>Home</title>
</head>
<body>
Hi... <?php session_start(); echo $_SESSION['username']; ?>
</body>
</html>
Manfaat script ini :
halaman tidak loading saat proses login..
Demo dan tutorial lainya dapat di lihat di
Persiapan Database
Persiapan struktur folder,
1. index.php => form login untuk tampilan awalnya
"<input type="text" id="username" placeholder="username"> <br>
<input type="password" id="password" placeholder="password"><br>
<button type="button" id="btn-login"> Login</button>"
jika di jalankan pada browser maka tampilan akan menjadi seperti gambar berikut :
<script type="text/javascript" src="http://code.jquery.com/jquery-3.2.1.min.js"></script>
Lalu Tambahkan script dimana script ini akan menjalankan proses ajax
<script type="text/javascript">
$(document).ready(function(){
$('#btn-login').click(function(){
var bangtiray={
username : $('#username').val(),
password : $('#password').val(),
}
$.ajax({
url:"login.php",
type:"POST",
data: bangtiray,
success:function(data){
var obj= $.parseJSON(data);
if(obj.status===1){
//ini akan mnampilkan pesan yang berhasil
//alert(obj.error);
window.open('home.php','_self');
}else{
//ini akan mnampilkan pesan kolom kosong
alert(obj.error);
}
}
})
})
})
</script>
2. Script file koneksi.lib.php
<?php
$host="localhost";
$user="root";
$pass="";
$database="latihan";
$conn = mysqli_connect($host , $user, $pass, $database) or die(mysqli_connect_error());
?>
3. script file login.php
<?php
session_start();
include('koneksi.lib.php');
$username = $_POST['username'];
$password = $_POST['password'];
if($username=="" || $password==""){
$status['status']=0; //bernilai salah
$status['error']="Mohon Input Kolom Kosong";
}else{
$sql='SELECT * FROM sys_user where username="'.$username.'" and password="'.sha1($password).'"';
$query=mysqli_query($conn, $sql) or ("error");
$row = mysqli_fetch_array($query);
$_SESSION['username']=$row["full_name"];
$status['status']=1; //bernilai benar
$status['error']="Berhasil Login dengan username " . $username;
}
echo json_encode($status);
?>
4. script home.php dimana file ini akan menampilkan session nama user
<!DOCTYPE html>
<html>
<head>
<title>Home</title>
</head>
<body>
Hi... <?php session_start(); echo $_SESSION['username']; ?>
</body>
</html>
Manfaat script ini :
halaman tidak loading saat proses login..
Demo dan tutorial lainya dapat di lihat di
PHP Tutorial Bahasa Indonesia Mysql Ajax Pemula: https://www.youtube.com/playlist?list=PLC4QS2zJf3uuvTxTQoDN1mZT4cVdeRQLo
Semoga Bermanfaat
Comment Please
Like Subscribe and Share on YT
Comment Please
Like Subscribe and Share on YT
Konsorsium Penjamin Indonesia
Ada yg baru nih kabar dari PT Asuransi Jasa Tania TBK
asuransi yg menampung penjaminan-penjaminan surety bond yang tergabung dari beberapa asuransi
dan dinamakan konsorsium penjamin indonesia
asuransi yg menampung penjaminan-penjaminan surety bond yang tergabung dari beberapa asuransi
dan dinamakan konsorsium penjamin indonesia
Konsorsium Penjamin Indonesia (KPI) terdiri dari beberapa perusahaan Asuransi Umum yang diketuai oleh PT. Asuransi Jasa Tania, Tbk Untuk memenuhi kebutuhan jaminan atas proyek Kementrian Pekerjaan Umum dan Perumahan Rakyat, Kementrian / Lembaga, BUMN, BUMD dan Instansi Lainnya
silahkan cek di sini http://www.konsorsium-kpi.com/
Konsorsium Penjamin Indonesia
Ada yg baru nih kabar dari PT Asuransi Jasa Tania TBK
asuransi yg menampung penjaminan-penjaminan surety bond yang tergabung dari beberapa asuransi
dan dinamakan konsorsium penjamin indonesia
asuransi yg menampung penjaminan-penjaminan surety bond yang tergabung dari beberapa asuransi
dan dinamakan konsorsium penjamin indonesia
