Đây là code sử dụng AJAX để kiểm tra đăng nhập cho wapego. Các bạn cũng có thể biến đổi để sử dụng cho các mã nguồn hay wapbuilder khác.
Đầu tiên mình rất xin lỗi các bạn đang chờ video từ mình. Bởi vì cái dự án của mình còn rất dang dở với cả năm sắp hết rồi nên mình muốn dành thời gian rảnh để viết code kia. Vì vậy nên chưa thể làm video được. Thôi thì viết tạm một bài để các bạn tham khảo.
Đầu tiên, chúng ta cần tậo một form đăng nhập, các bạn có thể thiết kế giao diện tuỳ ý nhưng chúng ta cần có 3 id cho thẻ form, thẻ input nick và input pass. Ví dụ với form mặc định của wapego:
<form action="main.php" method="get" id="form_login"> <input type="hidden" name="id" value="log"/> Tên truy nhập:<br/> <input name="nick" id="nick" maxlength="30"/><br/> Mật khẩu (tối thiểu 6 kí tự):<br/> <input name="pass" id="pass" maxlength="30" type="password"/><br/> Ghi nhớ tôi:<br/> <select name="rem"><option value="1">Có</option><option value="2">Không</option></select><br/> <input type="submit" value="Đăng nhập"/> </form>
Tiếp theo, chúng ta bắt đầu viết javascript nhé
Code cơ bản:
$(function(){ $('#form_login').submit(function(){ // Chạy hàm khi "submit" form_login nick = $('#nick').val(); // Lấy giá trị của tên nick nhập vào pass = $('#pass').val(); // Lấy giá trị mật khẩu nhập vào if(nick == '' || nick == null){ // Kiểm tra tên nick alert('Bạn chưa nhập tên đăng nhập!'); } else if(pass == '' || pass == null){ // Kiểm tra mật khẩu alert('Bạn chưa nhập mật khẩu'); } else { // Phần chính, chúng ra sẽ thực hiện AJAX load đến trang đăng nhập $.get('main.php?' + $(this).serialize(), function(data){ // Kiểm tra dữ liệu trả về if(data.indexOf('Sai mật khẩu') > -1){ // Nếu dữ liệu chứa từ: Sai mật khẩu alert('Mật khẩu không đúng!'); } else if(data.indexOf('chưa được đăng ký') > -1){ // Nếu dữ liệu chứa từ: chưa được đăng ký alert('Tài khoản không tồn tại!'); } else{ alert('Đăng nhập thành công!'); window.location.replace('main.php'); // Chuyển hướng về trang chủ } }) } return !1; // Ngăn chuyển hướng sau khi "sumit" }) })
Lưu ý:
- các bạn cần chỉnh sửa các từ được kiểm tra cho phù hợp với ngôn ngữ trang của bạn.
- javascript cần lưu vào file riêng mới có thể hoạt động chính xác
Vậy là chúng ta đã hoàn thành một form đăng nhập đơn giản sử dụng AJAX cho wapego. Các bạn có thể phát triển để có giao diện đẹp hơn.
Chúc các bạn thành công!
Copy đi nơi khác vui lòng ghi nguồn: http://phonho.net