Đang tải... (xem toàn văn)
Suggestions:
Mã JavaScript liệt kê bên Mã AJAX JavaScript Đây mã JavaScript, lưu trữ tập tin "clienthint.js": var xmlHttp function showHint(str) { if (str.length == 0) { document.getElementById("txtHint").innerHTML=""; return; } xmlHttp = GetXmlHttpObject(); if (xmlHttp == null) { alert("Your browser does not support AJAX!"); return; } www.w3schools.com CuuDuongThanCong.com Người dịch: Huỳnh Diệp Tân https://fb.com/tailieudientucntt var url = "gethint.asp"; url = url + "?q=" + str; url = url + "&sid=" + Math.random(); xmlHttp.onreadystatechange = stateChanged; xmlHttp.open("GET",url,true); xmlHttp.send(null); } function stateChanged() { if (xmlHttp.readyState == 4) { document.getElementById("txtHint").innerHTML=xmlHttp.responseText; } } function GetXmlHttpObject() { var xmlHttp = null; try { // Firefox, Opera 8.0+, Safari xmlHttp=new XMLHttpRequest(); } catch (e) { // Internet Explorer try { xmlHttp=new ActiveXObject("Msxml2.XMLHTTP"); } catch (e) { xmlHttp=new ActiveXObject("Microsoft.XMLHTTP"); } } return xmlHttp; } Trang máy chủ AJAX - ASP PHP Khơng có nhiều máy chủ AJAX Những trang AJAX lưu trữ máy chủ Internet Trang máy chủ gọi JavaScript ví dụ từ chương trước tập tin ASP đơn giản gọi "gethint.asp" Dưới liệt kê hai ví dụ mã trang phía máy chủ, viết ASP viết PHP www.w3schools.com CuuDuongThanCong.com Người dịch: Huỳnh Diệp Tân https://fb.com/tailieudientucntt Ví dụ ASP AJAX Đoạn mã trang "gethint.asp" viết VBScript cho Internet Information Server (IIS) Nó kiểm tra mảng tên trả tên tương ứng đến máy khách: Ví dụ PHP AJAX Đoạn mã sau viết PHP Chú ý: Để chạy tồn ví dụ PHP, nhớ đổi giá trị biến đường dẫn "clienthint.js" từ "gethint.asp" thành "gethint.php" Ví dụ PHP www.w3schools.com CuuDuongThanCong.com Người dịch: Huỳnh Diệp Tân https://fb.com/tailieudientucntt AJAX Database Example AJAX sử dụng cho giao tiếp với sở liệu Ví dụ Cơ sở liệu AJAX Database Trong ví dụ AJAX bên minh họa cách trang web lấy thơng tin từ sở liệu công nghệ AJAX Chọn tên hộp bên Alfreds Futterkiste Select a Customer: Customer info will be listed here Giải thích ví dụ AJAX Ví dụ chứa biểu mẫu HTML đơn giản liên kết đến JavaScript: Select a Customer: Alfreds Futterkiste North/South Wolski ZajazdCustomer info will be listed here.
Như bạn thấy biểu mẫu HTML đơn giản với hộp danh sách xổ xuống gọi "customers" Đoạn bên biểu mẫu chứa vùng gọi "txtHint" Vùng dùng làm nơi chứa thông tin nhận từ máy chủ web www.w3schools.com CuuDuongThanCong.com Người dịch: Huỳnh Diệp Tân https://fb.com/tailieudientucntt Khi người dùng chọn liệu, hàm "showCustomer()" thi hành Việc thi hành hàm bẫy kiện "onchange" Nói cách khác: Mỗi người dùng thay đổi giá trị hộp xổ xuống, hàm showCustomer gọi Mã JavaScript liệt kê bên Mã JavaScript AJAX Đây mã JavaScript chứa tập tin "selectcustomer.js": var xmlHttp function showCustomer(str) { xmlHttp=GetXmlHttpObject(); if (xmlHttp==null) { alert ("Your browser does not support AJAX!"); return; } var url = "getcustomer.asp"; url = url+ "?q=" + str; url = url + "&sid=" + Math.random(); xmlHttp.onreadystatechange = stateChanged; xmlHttp.open("GET",url,true); xmlHttp.send(null); } function stateChanged() { if (xmlHttp.readyState == 4) { document.getElementById("txtHint").innerHTML = xmlHttp.responseText; } } function GetXmlHttpObject() { var xmlHttp = null; try { // Firefox, Opera 8.0+, Safari xmlHttp = new XMLHttpRequest(); } catch (e) { // Internet Explorer try { xmlHttp=new ActiveXObject("Msxml2.XMLHTTP"); www.w3schools.com CuuDuongThanCong.com Người dịch: Huỳnh Diệp Tân https://fb.com/tailieudientucntt } catch (e) { xmlHttp = new ActiveXObject("Microsoft.XMLHTTP"); } } return xmlHttp; } Trang máy chủ AJAX Trang máy chủ gọi JavaScript, tập tin ASP đơn giản gọi "getcustomer.asp" Trang viết VBScript cho Internet Information Server (IIS) Nó viết dễ dàng PHP, vài ngôn ngữ khác Mã chạy SQL đến sở liệu trả kết bảng biểu HTML: www.w3schools.com CuuDuongThanCong.com Người dịch: Huỳnh Diệp Tân https://fb.com/tailieudientucntt Ví dụ AJAX XML AJAX dùng để giao tiếp với tập tin XML Ví dụ AJAX XML Trong ví dụ AJAX bên minh họa cách trang web lấy thơng tin từ tập tin XML công nghệ AJAX Chọn CD hộp bên Dolly Parton Select a CD: CD info will be listed here Giải thích ví dụ Ví dụ chứa biểu mẫu HTML đơn giản liên kết đến JavaScript: Select a CD: Bob Dylan Bonnie Tyler Dolly PartonCD info will be listed here.
Bạn thấy biểu mẫu HTML đơn giản hộp xổ xuống gọi "cds" Đoạn văn bên biểu mẫu chứa vùng gọi "txtHint" Vùng dùng lưu trữ thông tin tiếp nhận từ máy chủ Khi người dùng chọn liệu, hàm "showCD" thi hành Việc thi hành hàm bẫy kiện "onchange" Nói cách khác: Mỗi người dùng thay đổi giá trị hộp xổ xuống, hàm showCD gọi www.w3schools.com CuuDuongThanCong.com Người dịch: Huỳnh Diệp Tân https://fb.com/tailieudientucntt Mã JavaScript liệt kê bên Mã JavaScript AJAX Đây mã JavaScript chứa tập tin "selectcd.js": var xmlHttp function showCD(str) { xmlHttp = GetXmlHttpObject(); if (xmlHttp == null) { alert ("Your browser does not support AJAX!"); return; } var url = "getcd.asp"; url = url + "?q=" + str; url = url + "&sid=" + Math.random(); xmlHttp.onreadystatechange = stateChanged; xmlHttp.open("GET",url,true); xmlHttp.send(null); } function stateChanged() { if (xmlHttp.readyState == 4) { document.getElementById("txtHint").innerHTML = xmlHttp.responseText; } } function GetXmlHttpObject() { var xmlHttp = null; try { // Firefox, Opera 8.0+, Safari xmlHttp = new XMLHttpRequest(); } catch (e) { // Internet Explorer try { xmlHttp = new ActiveXObject("Msxml2.XMLHTTP"); } catch (e) { xmlHttp = new ActiveXObject("Microsoft.XMLHTTP"); } www.w3schools.com CuuDuongThanCong.com Người dịch: Huỳnh Diệp Tân https://fb.com/tailieudientucntt } return xmlHttp; } Trang máy chủ AJAX Trang máy chủ gọi JavaScript, tập tin ASP đơn giản gọi "getcd.asp" Trang viết VBScript cho Internet Information Server (IIS) Nó viết dễ dàng PHP, vài ngôn ngữ khác Mã chạy truy vấn đến tập XML trả kết dạng HTML: www.w3schools.com CuuDuongThanCong.com Người dịch: Huỳnh Diệp Tân https://fb.com/tailieudientucntt Ví dụ hồi đáp XML AJAX Trong responseText trả phản hồi HTTP chuỗi, responseXML trả phản hồi XML Thuộc tính ResponseXML trả đối tượng tài liệu XML, nhận diện tách cách dùng phương thức thuộc tính cấu trúc W3C DOM Ví dụ hồi đáp AJAX ResponseXML Trong ví dụ AJAX sau minh họa cách trang lấy thơng tin từ sở liệu công nghệ AJAX Những liệu chọn từ cở sở liệu lần chuyển đổi thành tài liệu XML, sau sử dụng DOM để kết xuất giá trị để hiển thị Chọn tên hộp Select a Customer: Giải thích ví dụ AJAX Ví dụ chứa biểu mẫu HTML, phần tử lưu giữ liệu trả về, liên kết đến JavaScript: Select a Customer: Alfreds Futterkiste North/South Wolski Zajazd www.w3schools.com CuuDuongThanCong.com Người dịch: Huỳnh Diệp Tân https://fb.com/tailieudientucntt Ví dụ chứa biểu mẫu HTML hộp xổ xuống gọi "customers" Khi người dùng chọn khách hành hộp xổ xuống, hàm "showCustomer()" thi hành Việc thi hành hàm bẫy kiện "onchange" Nói cách khác: Mỗi người dùng thay đổi giá trị hộp xổ xuống, hàm showCustomer() gọi Mã JavaScript liệt kê bên Mã AJAX JavaScript Đây mã JavaScript lưu trữ tập tin "selectcustomer_xml.js": var xmlHttp function showCustomer(str) { xmlHttp=GetXmlHttpObject(); if (xmlHttp==null) { alert ("Your browser does not support AJAX!"); return; } var url = "getcustomer_xml.asp"; url = url + "?q=" + str; url = url + "&sid=" + Math.random(); xmlHttp.onreadystatechange = stateChanged; xmlHttp.open("GET",url,true); xmlHttp.send(null); } function stateChanged() { if (xmlHttp.readyState==4) { var xmlDoc = xmlHttp.responseXML.documentElement; document.getElementById("companyname").innerHTML= xmlDoc.getElementsByTagName("compname")[0].childNodes[0].nodeValue; document.getElementById("contactname").innerHTML= xmlDoc.getElementsByTagName("contname")[0].childNodes[0].nodeValue; document.getElementById("address").innerHTML= xmlDoc.getElementsByTagName("address")[0].childNodes[0].nodeValue; document.getElementById("city").innerHTML= xmlDoc.getElementsByTagName("city")[0].childNodes[0].nodeValue; document.getElementById("country").innerHTML= xmlDoc.getElementsByTagName("country")[0].childNodes[0].nodeValue; } } function GetXmlHttpObject() { www.w3schools.com CuuDuongThanCong.com Người dịch: Huỳnh Diệp Tân https://fb.com/tailieudientucntt var xmlHttp=null; try { // Firefox, Opera 8.0+, Safari xmlHttp = new XMLHttpRequest(); } catch (e) { // Internet Explorer try { xmlHttp = new ActiveXObject("Msxml2.XMLHTTP"); } catch (e) { xmlHttp = new ActiveXObject("Microsoft.XMLHTTP"); } } return xmlHttp; } Các hàm showCustomer() GetXmlHttpObject() giống phần trước Hàm stateChanged() đề cập trước đây, nhiên; lần trả kết tài liệu XML (với responseXML) sử dụng DOM để kết xuất giá trị để hiển thị Trang máy chủ AJAX Trang máy chủ gọi bới JavaScript, tập tin ASP đơn giản gọi "getcustomer_xml.asp" Trang viết VBScript cho Internet Information Server (IIS) Nó viết dễ dàng PHP, vài ngôn ngữ khác Mã chạy truy vấn SQL đến sở liệu trả kết tài liệu XML: Để ý dòng thứ hai mã ASP trên: response.contenttype="text/xml" Thuộc tính ContentType đặt kiểu nội dung HTTP cho đối tượng hồi đáp Giá trị mặc định cho thuộc tính "text/html" Lần muốn kiểu nội dung XML Sau chọn liệu từ sở liệu, xây dựng tài liệu XML với liệu nhận www.w3schools.com CuuDuongThanCong.com Người dịch: Huỳnh Diệp Tân https://fb.com/tailieudientucntt ... https://fb.com/tailieudientucntt AJAX Database Example AJAX sử dụng cho giao tiếp với sở liệu Ví dụ Cơ sở liệu AJAX Database Trong ví dụ AJAX bên minh họa cách trang web lấy thơng tin từ sở liệu công nghệ AJAX Chọn... W3C DOM Ví dụ hồi đáp AJAX ResponseXML Trong ví dụ AJAX sau minh họa cách trang lấy thông tin từ sở liệu công nghệ AJAX Những liệu chọn từ cở sở liệu lần chuyển đổi thành tài liệu XML, sau sử dụng... https://fb.com/tailieudientucntt Ví dụ AJAX XML AJAX dùng để giao tiếp với tập tin XML Ví dụ AJAX XML Trong ví dụ AJAX bên minh họa cách trang web lấy thơng tin từ tập tin XML công nghệ AJAX Chọn CD hộp bên Dolly