trong phần body
<input type='text' name='txtUser'>
<input type='password' name='txtPass'>
<button id='login'> đăng nhập </button>
<script type='login.js' type='text/javascript'></script>
trong login.js
$('#login').click(function(){
$username = $("input[name='txtUser']");
$password = $("input[type='txtPass']");
$.post(
"login.php",
data:"username="+$username.val()+"&password="+$password.val(),
success:function(result)
{
if(result != "0")
{
$(this).html(result); // chữ đăng nhập trong nút đăng nhập sẽ được thay thế bằng tên đăng nhập của người dùng
// chổ nào có chữ đăng nhập thì chuyễn thành tên người dùng không tải lại trang. Ngoài ra xử lý gì thêm thì tùy
}
else
alert(" tên tài khoản hoặc mật khẩu không trùng khớp ");
}
)
})
login.php
// đoạn mã kết nối cơ sỡ dữ liệu
$sql = "select * from Account where username = '" . $_POST['username'] . "' and password = '" . $_POST['password'] . "'";
$result = DataProvider::QueryData($sql)
if($result->num_rows > 0)
{
while($rows = result->fetch_assoc())
{
echo $rows['username']; // xuất tên đăng nhập
}
}
else
{
echo "0"; // để ajax nhận kết quả
}
do đó
tập tin login.php có nội dung $rows[‘username’] hoặc là “0”. và result trong ajax chỉ lấy 1 trong 2 giá trị này để kiễm tra.
Ưu điểm của ajax là không cần rào dữ liệu gữi lên server bằng mà vẫn lấy được dữ liệu về và thay đỗi tại vị trí muốn đỗi lại. Đoạn mã trên chỉ là ví dụ thôi.