|
 |
| |
Login แบบไม่เปลี่ยนหน้าหลัก Ajax , jQuery เพิ่งหัดเขียนขอคำแนะนำด้วยนะครับ |
| |
 |
|
|
 |
 |
|
ศึกษาจากนี่คับ
https://www.thaicreate.com/tutorial/ajax-loading-web-page.html
---------------------------------------------------------------------------------------------------
Code (JavaScript)
$(document).ready(function(){
$('#login').click(function(){
$("#div1").load('wb/login.php');
});
});
Code (PHP)
<a href="#" id="login">login</a>
<div id="div1">
test
</div>
|
ประวัติการแก้ไข
2016-12-12 02:55:25
2016-12-12 02:56:24
 |
 |
 |
 |
| Date :
2016-12-12 02:37:24 |
By :
Luz |
|
 |
 |
 |
 |
|
|
 |
 |
|
 |
 |
| |
|
|
|
| |
|
คือไม่ใช่ครับผมต้องการแบบว่ากด Login แล้ว จะเปลี่ยนเฉพาะกรอบสีเหลืองนี้ครับ
ตอนนี้ผมดึงหน้า Login มาใส่ ใน <div id="div1"></div> แล้วครับ
เช่น กด Login ในหน้านี้คือ Login.php > Check_login.php > หน้าสมาชิก.php
แบบนี้แหละครับแต่อยากให้มันอยู่ในกรอบสีเหลือง
แต่ขอบคุณสำหรับคำตอบนะครับ
|
ประวัติการแก้ไข
2016-12-12 16:41:05
| |
|
|
| |
| Date :
2016-12-12 16:39:55 |
By :
kintoun |
|
|
| |
|
|
|
|
|
| |
|
|
|
| |
|
|
|
| |
|
ขอบคุณครับผม 
|
| |
|
|
| |
| Date :
2016-12-13 07:34:32 |
By :
kintoun |
|
|
| |
|
|
|
|
|
| |
|
|
|
| |
|
|
|
| |
|
พี่ครับลองโค้ดที่พี่บอก กดปุ่มแล้วไม่มีอะไรเกิดขึ้นเลยครับ
หน้า Login (test1.php)
Code (PHP)
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.6.4.js"></script>
</head>
<body>
<div id="div1"></div>
<input type="text" name="username" id="username">
<input type="password" name="password" id="password">
<button id="login">Login</button>
<script>
$(document).ready(function () {
$('#login').click(function(){
var username = $('#username').val();
var pwd = $('#password').val();
$.login(username,pwd);
})
$.login = function (username, pwd)
{
$.ajax({
async: false,
type: 'post',
data: {username: username, password: pwd},
url: "test2.php",
success: function (data) {
if (data != "")
{
if (data == 'success')
{
setTimeout( function(){alert('success')},1000);
$('#div1').load('test1.php');
} else if (data == 'fail')
{
alert('fail');
}
}
}
});
}
});
</script>
</body>
</html>
หน้า check_login (test2.php)
Code (PHP)
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.6.4.js"></script>
</head>
<body>
<?php
$username = $_POST['username'];
$password = $_POST['pwd'];
// ไปทำเงื่อนไขคิวรี่เอาเอง
if ($username == '1234' && $password == '1234') {
echo 'success';
} else {
echo 'fail';
}
?>
</body>
</html>
|
| |
|
|
| |
| Date :
2016-12-13 12:00:28 |
By :
kintoun |
|
|
| |
|
|
|
|
|
| |
|
|
|
| |
|
|
|
| |
|
หน้า check login บรรทัดที่ 12 เปลี่ยนจาก $_POST['pwd'] เป็น $_POST['password']
ปล. ค่าที่รับ อ้าอิงจาก หน้า login บรรทัดที่ 27
|
| |
|
|
| |
| Date :
2016-12-13 13:30:47 |
By :
Luz |
|
|
| |
|
|
|
|
|
| |
|
|
|
| |
|
|
|
| |
|
เหมือนเดิมครับผมก๊อปโค้ดต้นฉบับไปวางก็ไม่ได้เลยครับ
|
| |
|
|
| |
| Date :
2016-12-13 19:41:50 |
By :
kintoun |
|
|
| |
|
|
|
|
|
| |
|
|
|
|
|
| |
|
 Load balance : Server 00
|
