HOW TO RETRIEVE AJAX responseTEXT BY USING DOM ?

Mở notepad viết một bài ngắn về đề tài nào đó.Thí dụ đề tài Nhớ Mẹ rồi save theo dạng như sau :  nho_me.txt

Chép bảng html nầy vào notepad.Dùng browser Internet Explorer vì bảng html nầy chỉ chắc chắn hoạt động với Internet Explorer mà thôi.

Khi mở Internet Explorer , sẽ thấy xuất hiện chữ CLICK và hàng chữ nầy.

THÂN CHÀO QUÝ BẠN

  

Bấm chuột vaò chữ CLICK,hàng chữ THÂN CHÀO QUÝ BẠN biến mất ; những gì chúng ta viết trong file “ nho_me.txt”  xuất hịên và được chứa ngay trong div id=”T” vì chúng ta đã viết : document.getElementById("T").innerHTML=xhr.responseText 

Ngoài ra có thể dùng script sau đây phức tạp hơn script trên nhưng kết quả giống nhau.
   Có hai phương pháp thông dụng của AJAX là GET method và POST method.

Dùng GET khi chúng ta muốn lấy tài liệu bày ra rõ ràng để xem hay đọc.Còn POST thì dùng để gửi tài liệu update cho Server (updating information on the Server)

Như vậy với GET method phải viết  xhr.send( null ) với POST method thì viết xhr.send( params )     
      *   Phương pháp GET 
          var xhr;
          function request() {
             if (navigator.appName == "Microsoft Internet Explorer") {
            xhr = new ActiveXObject("Microsoft.XMLHTTP"); } 
             else {
            xhr = new XMLHttpRequest(); }
          var url = "nho_me.txt";
          var params = "lorem=ipsum&name=binny";
          xhr.open("GET", url+"?"+params, true);
          xhr.onreadystatechange = function() {
           if(xhr.readyState == 4) {
document.getElementById("T").innerHTML=xhr.responseText;}
  }
             xhr.send(null);}
lorem=ipsum&name=binny nghĩa là name1=value1&name2=value2
lorem là tên , là parameter .Còn ipsum là value1 ; binny là value2
Dấu & dùng để tách riêng 2 parameters.
Dấu hỏi ? dùng để nối params với url khi chúng ta xử dụng GET.
    *  Phương pháp POST   
      var url = “get_data.php”;

var params = "lorem=ipsum&name=binny";

      xhr.open(“POST”, url, true);
      xhr.onreadystatechange = function( ) {.
                if(xhr.readyState == 4 {
                                alert(xhr.responseText);} }
        xhr.send(params) 
Khi xử dụng POST thì chúng ta không cần nối url với params vì params sẽ được gửi ở phần tiếp theo phía dưới có kèm theo lòng thòng nhiều thứ cần phải gửi nữa.Như vậy nếu dùng POST thì code trở nên phức tạp hơn như thí dụ viết dưới đây. 
"get_data.php" là gì ?  Mở notepad dùng code của PHP viết một đề tài tuỳ ý chúng ta thích rồi save theo dạng .php với tên là get_data.php
    * POST method có kèm theo lòng thòng nhiều thư như sau.

      var xhr;

      function request() {

           xhr = new ActiveXObject("Microsoft.XMLHTTP");  

           var url = "get_data.php";
      var params = "lorem=ipsum&name=binny";

      xhr.open("POST",url,true);

    // Gửi chi tiết của header kèm theo với request
    xhr.setRequestHeader("Content-type","application/x-www-form-urlencoded");
    xhr.setRequestHeader("Content-length", params.length);
    xhr.setRequestHeader("Connection", "close");

    xhr.onreadystatechange = function() {

   if(xhr.readyState == 4) {

alert(xhr.responseText);}}

            xhr.send(params);

           }

Trong  open( ) method nếu có chứa parameter url ( Uniform Resource Locator ) thì theo qui định của W3C phải có một query string dính kết theo url.Trường hợp nầy áp dụng cho GET method mà thôi.

Query string là một một phần của url và là một tập họp bởi nhiều chữ tuỳ chúng ta chọn nhưng phải theo qui luật :  name1=value1&name2=value2 
 Luôn luôn name và value phải đi theo từng cặp.Mỗi cặp cách nhau bằng dấu & ( goị ampersand ) hoặc dấu chấm phẩy (semicolon).

Thí dụ . lorem=ipsum&name=binny 

             title=main_page&painting=colors

             year=2012&month=1&Day=28
Nối kết query string với url bằng dấu ? như thế nầy theo qui định của W3C.

  http://www.baxao.com / w / index/php?title=main_page&painting=colors

   Content-type cho biết data là text/html hay là hình ảnh .Nếu viết Content-type : image/png thì server biết đó là hình ảnh chứ không phải web page.

Content-length , params.length tức là length in bytes cho server biết số lượng bytes gửi đến.Khi server nhận đủ bytes thì Close Conection. Không nên dùng  Content-length chung với Connection  , close để cho server tự động giải quyết khi nhận đầy đủ data.

Khi dùng POST thì browser sẽ tự động encode data theo cách nầy : application/x-www-form-urlencoded .( có 3 cách encode data nhưng cách nầy rất phổ thông nên  thường dùng làm default )

Cầu mong Quý Bạn hiểu tất cả và áp dụng thành công.Cũng nên nhớ nếu không có gì bắt buộc thì không nên dùng AJAX.

Browser là software dùng để liên lạc , giao thông với Web Server bằng ngôn ngữ HTTP và chuyển đổi HTML và những codes hình ảnh thành chữ viết và hình xuất hiện trên màng hình monitor. 

HTTP viết tắt  của chữ Hypertext Transfer Protocol là ngôn ngữ để browser nói chuyện với server.

Web Server là software chạy trong bất cứ computer nào muốn chấp nhận công việc liên lạc và giao thông với browsers bằng ngôn ngữ HTTP.

Hiện nay có 2 Web Servers rất thông dụng là Apache và Microsoft Internet Information Server.