Азы зона

Прототип является наиболее широко используемым рамках операции "Ajax. Основным преимуществом использования прототипа Ajax рамки своей простотой в использовании, осуществляет автоматические крест-браузера и предлагает комплект полезных функций, которые можно использовать JavaScript в вашем коде. Эта статья будет список вниз различные пути, по которым вы можете сделать вызов с помощью Ajax Prototype Framework. Это учебное пособие не вдаваться в подробное осуществления, но показывает, каким образом мы можем сделать основной Ajax вызова с помощью прототипа Ajax Framework.

В прототипе существует три способа, вы можете делать звонки Ajax.
1) Ajax.Request
2) Ajax.PeriodicalUpdater
3) Ajax.Updater

Прежде чем перейти к обучению отдельных Ajax вызовов мы должны также понимать различные мероприятия и параметры используются при получении решений Ajax Вызвать.

Различные параметры объекта Передается Ajax.Request:
Метод
Это может быть HTTP GET и HTTP POST. По умолчанию это определено методом POST.

Параметры
Это касается пары ключ-значение данных, которые мы собираемся перейти на страницу запроса. Это те же данные, что мы проходим через строку запроса при вызове удаленного URL.

Частота
Здесь указывается период, в котором Ajax секунд звонок будет сделано.

распад
Это используется для увеличения интервалов времени для Ajax вызова, если нет никаких изменений в ответ. Получение суммы увеличились интервал частот * распада. , Убедитесь, что мы не будем делать ненужные вызова Ajax за тот же получить ответ от сервера.

Прототип Ajax события:
OnCreate:
Это событие вызывается всякий раз, когда сделал новое требование на Ajax. Это полезно, когда мы хотим показать загрузки изображений с указанием AJAX вызова.

OnSuccess:
Это событие вызывается при выполнении запроса и Возвращенный код состояния находится в 2xx серии.

OnFailure:
Это событие вызывается при выполнении запроса и статуса возвращается код не 2xx серии.

OnComplete:
Это событие вызывается при выполнении запроса и жизнь запрос на подключение полного цикла. Это событие вызывается после OnSuccess и OnFailure событие. В этом случае мы обычно скрывают загрузки изображений.

Рединг Запрос Ответ:
В основе прототипа можно читать как String, XML и JSON содержание. String содержимое может быть прочитано по телефону responseText метода, XML содержание может быть прочитан по телефону responseXML и JSON содержание может быть прочитан по телефону responseJSON методом.

Ajax.Request:
Здесь мы делаем один запрос в AJAX-сервером и после получения ответа от сервера прекращается подключение. Простое орудие для То же самое

	 "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 = новый Ajax. запроса (URL, (метод: 'POST', параметры: (операции: "readRecord"), OnCreate: функций (транспорт) (Alert ( "Создание нового вызова Аякс");), OnSuccess: функция (транспорт) (VAR serverResponse = транспорта. responseText;), OnFailure: функция (ответ) (Alert ( "ошибка произошла в то время, позвонив по удаленный сервер ");))); 

Здесь мы делаем объект Ajax.Request. Это объекты принимает 2 параметра первым параметром является 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 = новый Ajax. PeriodicalUpdater ( "textobj", URL, (
		 , Метод: 'POST',
		 , Периодичность: 3,
                 Гниль: 2
          )); 

Здесь мы делаем объект Ajax.PeriodicalUpdaterRequest. Это объекты принимает 3 параметра первым параметром является имя ДЕЛ / SPAN управления, при которой данные будут обновлены, второй параметр содержит URL запроса и третий параметр содержит объект, который обладает необходимой информацией, что мы будем отправки / получения от Сервер страницы.

Ajax.Updater:
Единственное различие между Ajax.Request и Ajax.Updater том, что в Ajax.Updater мы указываем ДЕЛ / 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 = новый Ajax. обновлений ( "textobj", URL, (
		 operation : "readRecord" } Параметры: (операции: "readRecord")
         )); 

Здесь мы делаем объект Ajax.Updater. Это объекты принимает 3 параметра первого параметра имя ДЕЛ / SPAN где эти данные будут обновлены, второй параметр содержит URL запроса и третий параметр содержит объект, который обладает необходимой информацией, что мы будем отправке / получении от сервера страницы.

Пример:
В этом примере я охватывающий все 3 Ajax вызова осуществления.

HTML код:

  <html>
	 <head>
		 <title> Прототип Ajax Позвонить </ TITLE>
		 <script type="text/javascript" src="js/prototype.js"> </ script>
		 <script type="text/javascript">
			 Функция ajaxRequest () (
				 VAR URL = "/ добавления / ajax_time.php";
				 VAR ajaxObjhttp = новый Ajax.Request (URL, (
					 Метод: 'POST',
					 Параметры: (операции: "readRecord"),
			                 OnCreate: Function (транспорт) (
			        	        Alert ( "Создание нового вызова Аякс");
			                 ),
			                 OnSuccess: Function (транспорт) (
			        		 VAR textBoxObj = document.getElementById ( "ajaxRequestCall");
			                         textBoxObj.innerHTML = transport.responseText;
			                 ),
			                 OnFailure: функция (ответ) (
			                        Alert ( "ошибка произошла в то время, позвонив по удаленному серверу");
			                )
			         ));  
			 )

    		         Функция 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, (
					 Метод: 'POST',
					 Периодичность: 3,
	        		         Гниль: 2
	    		         ));   	
			 )
		 </ script>
	 </ head>
             <body>
		 Ajax запрос: <span id="ajaxRequestCall" name="ajaxRequestCall" style="border: 1px твердо #CCCCCC"> </ SPAN> <ввод Type = "OnClick кнопки" = "ajaxRequest (); "Значение =" Ajax запрос "/> <br /> <br />		
	 Аякс обновлений: <span id="ajaxUpdaterCall" name="ajaxUpdaterCall" style="border: 1px твердо #CCCCCC"> </ SPAN> <ввод Type = "OnClick кнопки" = "ajaxUpdater (); "Value =" Аякс обновлений "/> <br /> <br />	
	 Аякс периодических обновлений: <span id="ajaxPeriodicUpdaterCall" name="ajaxPeriodicUpdaterCall" style="border: 1px твердо #CCCCCC"> </ SPAN> <ввод Type = "Button" OnClick = "ajaxPeriodicUpdater () ; "Value =" Аякс периодических обновлений "/> <br />	
	 </ body>
 </ html> 

Server Side КОД (PHP):

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

Server Side КОД (JSP):

  "java.util.Date" %> <% @ Page импорт = "java.util.Date"%>
 <%
	 new Date ( ) ; Дата CurrentDate = New Date ();
	 getTime ( ) ; долгое сиггеп = CurrentDate. GetTime ();
	 currentTime ) ; Out. println (CurrentTime);
 %> 

За каждого пользователя рабочей среды пользователя ли PHP или JAVA Я написал код на стороне сервера для обоих языков. Пользователю достаточно изменить URL в коде JavaScript.

Пользовательский поиск

Популярные статьи:

• Основы AJAX - Часть 1
• Каким AJAX Работы
• Что такое AJAX
• Основы AJAX - Часть 2
• ФОРМА пост в PHP Использование Ajax