Techie зона

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

В Прототип Есть три способа сделать Ajax вызовы.
1) Ajax.Request
2) Ajax.PeriodicalUpdater
3) Ajax.Updater

Прежде чем мы перейдем к изучению отдельных Ajax вызов мы также должны понимать различные мероприятия и параметры используются при получении решений Call 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" ) ; } } ) ; "Http://www.hiteshagrawal.com/uploads/ajax_time.php"; VAR = ajaxObjhttp новых Ajax. Запроса (URL, название (метод: "POST ', вар URL = параметров: (операции:" readRecord "), OnCreate: функции (транспорта) (оповещение ("Создание новых Ajax Call");), onSuccess: функция (транспорт) (VAR serverResponse = транспорта. responseText;), onFailure: функции (ответ) (оповещения ("Некоторые Произошла ошибка при принятии вызова удаленным сервером ");))); 

Здесь мы делаем объект 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 параметра замедления первых это имя 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 новых Ajax. Updater ("textobj", URL, (
		 operation : "readRecord" } Параметры: (операции: "readRecord")
         )); 

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

Пример:
В этом примере я, охватывающих все три вызова Ajax реализации.

HTML код:

  <html>
	 <head>
		 Прототип <title> Ajax Call </> название
		 <script type="text/javascript" src="js/prototype.js"> </> сценарий
		 <script type="text/javascript">
			 ajaxRequest функции () (
				 VAR URL = "/ добавления / ajax_time.php";
				 VAR = ajaxObjhttp новых Ajax.Request (URL, название (
					 Метод: "POST,
					 Параметры: (операции: "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, (
					 Метод: "POST,
					 частота: 3,
	        		         распада: 2
	    		         ));   	
			 )
		 </> Сценарий
	 </> Голову
             <body>
		 Ajax запрос: <span id="ajaxRequestCall" name="ajaxRequestCall" style="border: 1px твердых <#CCCCCC"> / span> <ввод типа = "Кнопка" OnClick = "ajaxRequest (); "значение =" Ajax запрос "/> <br /> <br />		
	 Ajax обновлений: <span id="ajaxUpdaterCall" name="ajaxUpdaterCall" style="border: 1px твердых <#CCCCCC"> / span> <ввод типа = "Кнопка" OnClick = "ajaxUpdater (); "значение =" Ajax обновлений "/> <br /> <br />	
	 Ajax периодических обновлений: <span id="ajaxPeriodicUpdaterCall" name="ajaxPeriodicUpdaterCall" style="border: 1px твердых <#CCCCCC"> / span> <ввод типа = "Кнопка" OnClick = "ajaxPeriodicUpdater () ; "значение =" Ajax периодических обновлений "/> <br />	
	 </> Тела
 </ HTML> 

SERVER часть кода (PHP):

  <?
	 ( "H:i:s" ) ; эхо дня ("H: я: S");
 ?> 

Server Side CODE (JSP):

 "java.util.Date" %> < % Date currentDate = new Date ( ) ; long currentTime = currentDate . getTime ( ) ; out . println ( currentTime ) ; %> <% @ Page импорта = "java.util.Date"%> <% Дата currentDate = новая дата (); долгое сиггепЬТЧте = currentDate. GetTime (); из. Println (сиггепЬТЧте);%> 

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

Система пользовательского поиска

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

• HTTP POST ФОРМА в PHP использованием AJAX
• Ajax вычислениям Прототип Рамочной
• Общие ошибки программирования AJAX
• Ajax Программирование
• HTTP POST Форма запроса с помощью AJAX и Servlet