Techie Khu

Nguyên mẫu là sử dụng rộng rãi nhất cho khung Ajax hoạt động. Các lợi thế chính của việc sử dụng Prototype Ajax Framework là sự đơn giản của nó để sử dụng, tự động thực hiện qua trình duyệt và nó cung cấp chức năng gói các tiện ích mà có thể được sử dụng trong mã JavaScript của bạn. Bài viết này sẽ xuống danh sách bằng nhiều cách khác nhau mà bạn có thể thực hiện cuộc gọi bằng cách sử dụng Prototype Ajax Framework. Hướng dẫn này không đi vào chi tiết, nhưng thực hiện cho bạn thấy làm thế nào chúng tôi có thể làm cơ bản sử dụng thử nghiệm Call Ajax Ajax Framework.

Trong thử nghiệm có ba cách bạn có thể thực hiện cuộc gọi Ajax.
1) Ajax.Request
2) Ajax.PeriodicalUpdater
3) Ajax.Updater

Trước khi chúng tôi di chuyển vào học tập của cá nhân Ajax gọi chúng tôi cũng cần phải hiểu những sự kiện khác nhau và các thông số nhận được sử dụng trong khi thực hiện cuộc gọi Ajax.

Các tham số của các đối tượng Qua để Ajax.Request:
phương pháp
Điều này có thể được HTTP GET hay HTTP POST. Bằng phương pháp mặc định được định nghĩa là POST.

các thông số
Điều này giữ cặp khoá-giá trị của dữ liệu mà chúng ta sẽ đi đến trang yêu cầu. Đây là cùng một dữ liệu mà chúng tôi đi qua các chuỗi truy vấn trong khi gọi điện thoại từ xa URL.

tần số
Ở đây bạn chỉ định thời gian trong vài giây trong đó các cuộc gọi Ajax sẽ được thực hiện.

phân rã
Này được sử dụng để tăng thời gian cho Ajax gọi nếu không có sự thay đổi trong phản ứng. Số tiền nhận được tăng khoảng * tần số là sâu răng. Điều này đảm bảo rằng chúng tôi không làm cho Ajax không cần thiết gọi cho cùng một phản ứng nhận được từ máy chủ.

Nguyên mẫu Ajax sự kiện:
onCreate:
Sự kiện này được gọi là bất cứ khi nào một ajax gọi mới yêu cầu được thực hiện. Điều này rất hữu ích khi chúng ta muốn hiển thị một hình ảnh tải chỉ gọi ajax.

onSuccess:
Sự kiện này được gọi là bất cứ khi nào yêu cầu được hoàn thành và mã trạng thái 2xx trở lại là trong series.

onFailure:
Sự kiện này được gọi là bất cứ khi nào yêu cầu được hoàn thành và trả lại mã trạng thái 2xx không có trong series.

onComplete:
Sự kiện này được gọi là bất cứ khi nào yêu cầu được hoàn thành và yêu cầu kết nối vòng đời hoàn tất. Sự kiện này được gọi là sau khi onSuccess và sự kiện onFailure. Trong trường hợp này, chúng tôi thường ẩn các hình ảnh tải.

Đọc những đáp ứng yêu cầu:
Với khung mẫu thử nghiệm chúng tôi có thể đọc hoặc String, XML và nội dung JSON. String nội dung có thể được đọc bằng cách gọi phương pháp responseText, nội dung XML có thể được đọc bằng cách gọi responseXML và nội dung JSON có thể được đọc bằng cách gọi phương pháp responseJSON.

Ajax.Request:
Ở đây chúng tôi làm cho một yêu cầu ajax đơn đến một trang máy chủ và sau khi nhận được phản hồi từ máy chủ kết nối được chấm dứt. Việc thực hiện đơn giản cho cùng là

  "http://www.hiteshagrawal.com/uploads/ajax_time.php" ; var url = "http://www.hiteshagrawal.com/uploads/ajax_time.php";
	 new Ajax. Request ( url , { var ajaxObjhttp = new Ajax,. Yêu cầu (url (
		 , phương pháp: "POST",
		 operation : "readRecord" } , tham số: (hoạt động: "readRecord"),
                 ( transport ) { onCreate: chức năng (vận chuyển) (
        	       "Creating New Ajax Call" ) ; alert ("Tạo mới Ajax Call");
                 ),
                 ( transport ) { onSuccess: chức năng (vận chuyển) (
                       transport. responseText ; var serverResponse = vận tải. responseText;
                 ),
                 ( response ) { onFailure: chức năng (phản hồi) (
                       "Some error occured while making call to remote server" ) ; alert ("Một số lỗi xảy ra trong khi thực hiện cuộc gọi đến máy chủ từ xa");
                 )
         )); 

Ở đây chúng tôi làm cho một đối tượng Ajax.Request. Các đối tượng này chấp nhận 2 tham số tham số đầu tiên là trang yêu cầu url và đối tượng khác nắm giữ các thông tin cần thiết mà chúng tôi sẽ được gửi / nhận từ trang chủ. Ngày thành công tiếp nhận dữ liệu từ các trang yêu cầu chúng ta đọc dữ liệu bằng cách gọi phương pháp responseText.

  "http://www.hiteshagrawal.com/uploads/ajax_time.php" ; var url = "http://www.hiteshagrawal.com/uploads/ajax_time.php";
	 new Ajax. PeriodicalUpdater ( "textobj" , url , { var ajaxObjhttp = new Ajax ". PeriodicalUpdater (" textobj, url, (
		 , phương pháp: "POST",
		 , tần số: 3,
                 phân rã: 2
          )); 

Ở đây chúng tôi làm cho một đối tượng của Ajax.PeriodicalUpdaterRequest. 3 đối tượng này chấp nhận tham số này paramter đầu tiên là tên của DIV soát SPAN / nơi dữ liệu sẽ được cập nhật, thứ hai tham số giữ URL yêu cầu và tham số thứ ba giữ một đối tượng trong đó có các thông tin cần thiết mà chúng tôi sẽ được gửi / nhận từ máy chủ trang.

Ajax.Updater:
Sự khác biệt duy nhất giữa Ajax.Request và Ajax.Updater là trong Ajax.Updater chúng tôi chỉ định các DIV / SPAN soát tên như vậy bây giờ các dữ liệu trả về từ máy chủ sẽ nhận được tự động cập nhật trong vòng kiểm soát DIV SPAN / khi hoạt động hoàn thành.

  "http://www.hiteshagrawal.com/uploads/ajax_time.php" ; var url = "http://www.hiteshagrawal.com/uploads/ajax_time.php";
	 new Ajax. Updater ( "textobj" , url , { var ajaxObjhttp = new Ajax ". Updater (" textobj, url, (
		 operation : "readRecord" } tham số: (hoạt động: "readRecord")
         )); 

Ở đây chúng tôi làm cho một đối tượng Ajax.Updater. 3 đối tượng này chấp nhận tham số tham số đầu tiên là tên của DIV các / SPAN nơi dữ liệu sẽ được cập nhật, thứ hai tham số giữ URL yêu cầu và tham số thứ ba giữ một đối tượng trong đó có các thông tin cần thiết mà chúng tôi sẽ được gửi / nhận từ máy chủ Trang.

Ví dụ:
Trong ví dụ này tôi đang bao phủ tất cả việc thực hiện 3 cuộc gọi Ajax.

HTML Code:

	 <html> <head> <title> Prototype Ajax Call </ title> <script type="text/javascript" src="js/prototype.js"> </ script> <script type="text/javascript"> chức năng ajaxRequest () (var url = "/ uploads / ajax_time.php"; ajaxObjhttp var = new Ajax.Request (url, (phương pháp: "POST", các tham số: (hoạt động: "readRecord"), onCreate: chức năng (vận chuyển) ( alert ("Tạo mới Ajax Call");), onSuccess: chức năng (vận chuyển) (var textBoxObj = document.getElementById ("ajaxRequestCall"); textBoxObj.innerHTML = transport.responseText;), onFailure: chức năng (phản ứng) (alert ( "Một số lỗi xảy ra trong khi thực hiện cuộc gọi đến máy chủ từ xa");)));) ajaxUpdater chức năng () (var url = "/ uploads / ajax_time.php"; textBoxObj var = ajaxUpdaterCall ""; var ajaxObjhttp = new Ajax.Updater ( textBoxObj, url, (phương pháp: 'POST'));) chức năng ajaxPeriodicUpdater () (var url = "/ uploads / ajax_time.php"; var textBoxObj = "ajaxPeriodicUpdaterCall"; var ajaxObjhttp = new Ajax.PeriodicalUpdater (textBoxObj, url, POST, tần số phương pháp: "(: 3, phân rã: 2));) </ script> </ head> <body> Ajax Yêu cầu: <span id =" "tên ajaxRequestCall =" ajaxRequestCall "style =" border: 1px rắn # CCCCCC "> </ span> <input type="button" onClick="ajaxRequest();" value="Ajax Request"/> <br /> <br /> Ajax Updater: < span id = "tên ajaxUpdaterCall" = "ajaxUpdaterCall" style = "border: 1px solid # CCCCCC"> </ span> <input type = "nút" onclick = "ajaxUpdater ();" giá trị = " Ajax Updater "/> <br /> <br /> Ajax định kỳ Updater: <span name="ajaxPeriodicUpdaterCall" id="ajaxPeriodicUpdaterCall" style="border: 1px solid #CCCCCC"> </ span> <input type="button" onClick="ajaxPeriodicUpdater();" value="Ajax định kỳ Updater"/> <br /> </ body> </ html> 

SERVER PHỤ CODE (PHP):

  <?
	 ( "H:i:s" ) ; Ngày echo ("H: i: s");
 ?> 

SERVER PHỤ CODE (JSP):

  "java.util.Date" %> <% @ Trang nhập khẩu = "java.util.Date"%>
 <%
	 new Date ( ) ; Ngày currentDate = new Date ();
	 getTime ( ) ; dài currentTime = currentDate). getTime (;
	 currentTime ) ; ra (. println currentTime);
 %> 

Theo người sử dụng môi trường làm việc của người sử dụng hay không PHP hoặc JAVA i đã viết mã phía máy chủ cho cả hai ngôn ngữ. Người dùng chỉ phải thay đổi địa chỉ trong mã javascript.

Tìm kiếm Tuỳ chỉnh

Phổ biến các điều:

• AJAX Demo
• HTTP MẪU POST trong PHP sử dụng AJAX
• Kiểm tra Session timeout trong Ajax Call
• Hình thức HTTP POST Yêu cầu sử dụng AJAX và Servlet
• Ajax Lập trình