Ajax and Json
Tạo file service
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 |
//get URL cua file hien tai; $baseUrl = $_SERVER['PHP_SELF']; //kiem tra thong tin request den if (isset($_POST['getMember']) && $_POST['getMember'] == 'view') { //wating 1s truoc khi thuc thi sleep(1); //tao mang member $member = array('username' => 'phucvh' ,'password' => '123456' //dung ham json_encode de chuyen mang $member thanh chuoi <a class="zem_slink" title="JSON" href="http://en.wikipedia.org/wiki/JSON" target="_blank" rel="wikipedia noopener">JSON</a> echo json_encode($member); //ket thuc tra ve du lieu va stop khong cho chay tiep die; } |
Xử lý Ajax phía client
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 |
$(document).ready(function(){ // Gắn sự kiện onclick vào #viewbtn $('#viewbtn').click(function() { $('#loading').html('Loading...'); var strURL = $('#base_url').val(); $.ajax({ url: strURL, type: 'POST', cache: false, data: 'getMember=view', success: function(string){ /** * Kiểu mặc định trả về là dạng String, bạn dùng hàm parseJSON để phân tích dữ liệu trả về * có 2 cách parse JSON là : JSON.parse() và $.parseJSON(); * 1. var getData = JSON.parse(string); * 2. var getData = $.parseJSON(string); **/ var getData = $.parseJSON(string); //input dữ liệu lấy về từ server vào textbox $('#txt_username').val(getData.username); $('#txt_password').val(getData.password); $('#txt_email').val(getData.email); //Trả loading về trạng thái ban đầu $('#loading').html(' '); }, error: function (){ alert('Có lỗi xảy ra'); } }); }); // Gắn sự kiện onclick vào #resetbtn $('#resetbtn').click(function() { $('input:text').val(''); // xóa hết dữ liệu trong textbox }); }); |
- url: đuờng dẫn file php sẽ xử lý yêu cầu của bạn
- type: kiểu dữ liệu bạn gửi lên Server (POST, GET)
- data: dữ liệu bạn gửi lên là gì? (getMember= view)
- success: khi server xử lý thành công sẽ trả về ở đây, tai đây bạn sẽ xử lý phân tích chuỗi JSON, và điền dữ liệu vào các textbox.
=> dùng hàm $.parseJSON(string) để phân tích chuỗi JSON, trong đó string là khối dữ liệu trả về từ phía Server.
Nguồn: http://ntuts.com/jquery/huong-dan/ket-hop-su-dung-json-ajax-voi-jquery-va-php
–soiqualang.chentreu