Techie зона

Prototype е най-широко използваните рамка за Ajax операция. Основното предимство на използването на Prototype Ajax рамка е нейната простота на използване, автоматично прилага кръстосано браузъра и предлага набор от полезни функции, които могат да бъдат използвани в кода на JavaScript. В тази статия ще списъка определят различни начини, чрез които можете да направите повикване с използване на Ajax Prototype рамка. Този урок не навлиза в подробното прилагане но ви показва как можем да направим основен Аякс повикване, използвайки Prototype Ajax рамка.

В Prototype има три начина можете да направите Ajax разговори.
1) Ajax.Request
2) Ajax.PeriodicalUpdater
3) Ajax.Updater

Преди да се движат в изучаването на отделните Ajax разговори ние също трябва да разберат различните събития и параметри привикване като същевременно Аякс покана.

Различните параметри на обекта Приет на Ajax.Request:
метод
Това може да бъде HTTP GET или HTTP POST. По подразбиране е определен метод POST.

параметрите
Този ключ-стойност двойки на данни, които ние ще се премине към по искане страницата. Това е едни и същи данни, които минат на заявка низ като същевременно призовава дистанционно URL.

честота
Тук можете посочва периода, в който за секунди Аякс обаждане ще бъде направено.

гниене
Това се използва за увеличение на времевия интервал за Аякс се обадя, ако няма промяна в отговор. Размерът на интервал Първи увеличава е разпад честота *. Това гарантира, че ние не правим ненужни Аякс покана за представяне на един и същ отговор Първи от сървъра.

Prototype Ajax Събития:
onCreate:
Това събитие се нарича, когато една нова покана Аякс е отправено искането. Това е полезно, когато ние искаме да покажем едно зареждане изображение показва Аякс повикване.

onSuccess:
Това събитие се нарича всеки път, когато искането е пълно и статута върнат код е в 2хх серия.

onFailure:
Това събитие се нарича всеки път, когато искането е пълно и статута върнат код не е в 2хх серия.

onComplete:
Това събитие се нарича всеки път, когато искането е пълна и връзката цикъл искане живот е пълна. Това събитие стана, наречен на името onSuccess и събития onFailure. В този случай ние обикновено се скрие изображение натоварване.

Искане за четене Отговор:
С прототип рамка можем да прочетем, или низ, XML и JSON съдържание. Струнен съдържание може да се чете като се обадите responseText метод, XML съдържание може да се чете като се обадите responseXML и JSON съдържание може да се чете като се обадите responseJSON метод.

Ajax.Request:
Тук ние правим една и съща молба Аякс до сървъра страницата и след получаване на отговор от сървъра връзката се прекратява. Самото изпълнение за същата е

	 "http://www.hiteshagrawal.com/uploads/ajax_time.php" ; var ajaxObjhttp = new Ajax. Request ( url , { method : 'POST' , parameters : { operation : "readRecord" } , onCreate : function ( transport ) { alert ( "Creating New Ajax Call" ) ; } , onSuccess : function ( transport ) { var serverResponse = transport. responseText ; } , onFailure : function ( response ) { alert ( "Some error occured while making call to remote server" ) ; } } ) ; Var URL = "http://www.hiteshagrawal.com/uploads/ajax_time.php"; Var ajaxObjhttp = нови Аякс. Искане (URL, (метод: "Публикувай", параметри: (операция: "readRecord"), onCreate: функция (транспорт) (сигнал ("Създаване на нови Ajax Call");), onSuccess: (функция транспорт) (Var serverResponse = транспорт. responseText;), onFailure: (функция отговор) (сигнал ("Някои грешка при вземане на покана за отдалечен сървър ");))); 

Тук правим обект на Ajax.Request. Това обекти приема два параметъра на първия параметър е URL искане страница и друг обект, който притежава най-важната информация, че ние ще се изпраща / получава от сървъра страница. На успешно получаване на данни от заявената страница четем на данни, като се обадите 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 = нови Аякс. PeriodicalUpdater ("textobj", URL, (
		 , метод: "Публикувай",
		 , Честота: 3,
                 разпад: 2
          )); 

Тук правим обект на Ajax.PeriodicalUpdaterRequest. Това обекти приема три параметъра на първо Параметрите е името на DIV / SPAN контрол, когато данните ще се актуализира, вторият параметър притежава искане URL и трети параметър притежава един предмет, който е най-важната информация, че ние ще се изпраща / получава от сървър страницата.

Ajax.Updater:
Единствената разлика между Ajax.Request и Ajax.Updater е, че в Ajax.Updater ние определяме DIV / SPAN контрол име, така сега данните, върнати от сървъра ще се актуализират автоматично в DIV / SPAN контрол, когато операцията приключи.

  "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 = нови Аякс. Updater ("textobj", URL, (
		 operation : "readRecord" } параметри: (операция: "readRecord")
         )); 

Тук правим обект на Ajax.Updater. Това обекти приема три параметъра на първия параметър е името на DIV / SPAN, когато данните ще се актуализира, вторият параметър притежава искане URL и трети параметър притежава един предмет, който е най-важната информация, че ние ще се изпраща / получава от сървъра страница.

Пример:
В този пример аз съм за всички на 3 Ajax разговори изпълнение.

HTML код:

  <html>
	 <head>
		 <title> Prototype Ajax Покана </ заглавие>
		 <script type="text/javascript" src="js/prototype.js"> </ ръкопис>
		 <script type="text/javascript">
			 ajaxRequest функция () (
				 Var URL = "/ качени / ajax_time.php";
				 Var ajaxObjhttp = нови Ajax.Request (URL, (
					 метод: "Публикувай",
					 параметри: (операция: "readRecord"),
			                 onCreate: функция (транспорт) (
			        	        сигнал ("Създаване на нови Ajax Call");
			                 ),
			                 onSuccess: функция (транспорт) (
			        		 Var textBoxObj = document.getElementById ("ajaxRequestCall");
			                         textBoxObj.innerHTML = transport.responseText;
			                 ),
			                 onFailure: функция (отговор) (
			                        сигнал ("Някои грешка при вземане на повикване към отдалечен сървър");
			                )
			         ));  
			 )

    		         ajaxUpdater функция () (
				 Var URL = "/ качени / ajax_time.php";
				 Var textBoxObj = "ajaxUpdaterCall";
				 Var ajaxObjhttp = нови Ajax.Updater (textBoxObj, URL, (
					 метод: "POST"
	    		         ));  
			  )

			 ajaxPeriodicUpdater функция () (
				 Var URL = "/ качени / ajax_time.php";
				 Var textBoxObj = "ajaxPeriodicUpdaterCall";
				 Var ajaxObjhttp = нови Ajax.PeriodicalUpdater (textBoxObj, URL, (
					 метод: "Публикувай",
					 Честота: 3,
	        		         разпад: 2
	    		         ));   	
			 )
		 </ Ръкопис>
	 </ Глава>
             <body>
		 Аякс Заявка: <span id="ajaxRequestCall" name="ajaxRequestCall" style="border: 1px твърди #CCCCCC"> </ педя> <вход тип = "копче" OnClick = "ajaxRequest (); "стойност =" Аякс Заявка "/> <br /> <br />		
	 Аякс Updater: <span id="ajaxUpdaterCall" name="ajaxUpdaterCall" style="border: 1px твърди #CCCCCC"> </ педя> <вход тип = "копче" OnClick = "ajaxUpdater (); "стойност =" Аякс Updater "/> <br /> <br />	
	 Аякс Периодичен Updater: <span id="ajaxPeriodicUpdaterCall" name="ajaxPeriodicUpdaterCall" style="border: 1px твърди #CCCCCC"> </ педя> <вход тип = "копче" OnClick = "ajaxPeriodicUpdater () ; "стойност =" Аякс Периодичен Updater "/> <br />	
	 </ Тялото>
 </ HTML> 

Server Side кодекс (PHP):

 date ( "H:i:s" ) ; ?> <? Ехо дата ("H: I: S");?> 

Server Side кодекс (JSP):

  "java.util.Date" %> <% @ Страницата внос = "java.util.Date"%>
 <%
	 new Date ( ) ; Дата currentDate = нова дата ();
	 getTime ( ) ; дълго currentTime = currentDate. getTime ();
	 currentTime ) ; вън. println (currentTime);
 %> 

Както всеки потребител работната среда на потребителя, дали PHP или JAVA съм написал кода сървъра страна и за двата езика. Потребителят трябва само да променя URL в JavaScript код.

Персонализирано търсене

Популярни членове:

• Как AJAX работнически
• Общата Програмиране Грешки AJAX
• Демонстрация AJAX
• Проверка сесия Времето през Ajax Покана
• Ajax Програмиране