Каскадный режим | Линейный режим

***all__*** · 16.02.2010 16:43

Покопался в интернете и обнаружил, что в сети валяется масса нерабочих примеров применения Post запроса в JavaScript. Поэтому, решил восполнить этот недостаток, и подготовить рабочий пример.

Приложение будет отправлять число на сервер, php скрипт его умножит и вернет обратно клиенту. В этом примере кодировка windows-1251.
Создаем index.html

Код:

<HTML><HEAD>

<META content="text/html; charset=utf-8" http-equiv="Content-Type"><TITLE>Пример POST-запроса в технологии AJAX</TITLE>

</HEAD><BODY>

Введите данные: <INPUT type="text" id="data"> <INPUT type="button" value="Отправить" onclick="SendPOST()"><BR><BR>

Результат:<br>x = <span id="x1"></span><br>x^2 = <span id="x2"></span>

<script type="text/javascript" src="send.js"></script>

</BODY></HTML>

Вводить данные мы будем в input с id="data" , при нажатии кнопки будет выполняться SendPOST().
send.js - это наш скрипт

Код:

function SendPOST()

{

var data = document.getElementById('data').value; //получаем данные из текстового поля

ajaxSendPOST('post.php','q='+encodeURI(data), SendCallback);

}

function SendCallback(answer) { 

    var ans = eval( '(' + answer + ')' ); // Преобразуем полученный в данных объект из текстового вида 

    if (ans.res=='error') { alert(ans.msg);return; } 

    if (ans.res!='ok') { alert('Странный ответ… И не "error", и не "ok"…');return; } 

    document.getElementById('x1').innerHTML=ans.x1; 

    document.getElementById('x2').innerHTML=ans.x2; 

}

/*

Параметр data – передаваемые данные, формат:

data = 'var1='encodeURI(var1) +'&var2='encodeURI(var2);

*/

function ajaxSendPOST(xmlpage,data,callback)

{

var xmlh = null;

if(window.XMLHttpRequest)

xmlh = new XMLHttpRequest();

else

try

{ xmlh = new ActiveXObject('Msxml2.XMLHTTP'); }

catch(ex) { xmlh = new ActiveXObject('Microsoft.XMLHTTP'); }

if(xmlh)

{

xmlh.open('post', xmlpage, true);

xmlh.onreadystatechange = function(x) { if(xmlh.readyState==4) callback(xmlh.responseText); }

xmlh.setRequestHeader("Accept-Charset", "windows-1251");

xmlh.setRequestHeader("Accept-Language","ru, en");

xmlh.setRequestHeader("Connection", "close");

xmlh.setRequestHeader("Content-length", data.length); // Длинна отправляемых данных

xmlh.setRequestHeader("Content-type", "application/x-www-form-urlencoded");

xmlh.send(data); // отправляем данные

}

}

Осталось написать скрипт post.php

Код:

<?php

$q=$_POST['q'];

if(!$q) die('{"res":"error", "msg":"Не пришло никаких данных!"}');

echo '{"res":"ok", "x1":"'.$q.'", "x2":"'.$q*$q.'"}';

?>

Рабочий пример вы можете скачать в прикреплении.

25.08.2011 14:54

в комментари ошибка Smile

data = 'var1='encodeURI(var1) +'&var2='encodeURI(var2);

плюсы потерялись

Похожие темы
Тема:		Автор	Ответов:	Просмотров:	Посл. сообщение
	Работа с canvas - простейший пример	all__	0	4 023	12.07.2011 14:30 Посл. сообщение: all__
	Post запрос timeout - Пример 2	all__	77	10 190	16.02.2010 17:00 Посл. сообщение: all__
	Простейший пример DOM (Document Object Model)	all__	52	8 116	16.02.2010 16:33 Посл. сообщение: all__

Каскадный режим \| Линейный режим Post запрос - Пример 1
Автор	Сообщение