Скрипт:

Код

// Скрипт для отправки запросов на сервер без обновления страницы методом POST. // Author: PHP-DIRECTOR <[email protected]> // Протестировано в IE 6.0, FireFox 1.0, Opera 8.01 function createRequestObject() { if (window.XMLHttpRequest) { var obj = new XMLHttpRequest(); } else {         var obj = new ActiveXObject('Msxml2.XMLHTTP');         if(!obj) { var obj = new ActiveXObject('Microsoft.XMLHTTP'); }      } return obj; } function ReLoad(url,data) {  var Req = createRequestObject();  Req.onreadystatechange = function(){if(Req.readyState==4&&Req.status==200) { eval(Req.responseText); }};  Req.open('POST',url,true);  Req.setRequestHeader("Content-Type","application/x-www-form-urlencoded");  Req.send(data); } setInterval('ReLoad("name.php","name1=value1&name2=value2")', 5000);

Данный код посылает данные методом POST на сервер без перезагрузки страницы.
Причем посылка данных происходит каждые 5 сек через setInterval.

Но это всего лишь пример. Можно и без постоянных обновлений послать запросы.
Вообщем, я показал пример. Ваша задача оклиматизировать его под ваши веб-приложения.

Надеюсь, этот код будет кому-то полезен.

Ответ от сервера должен содержать JavaScript-код который будет выполнен на странице через eval()

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

Работает в MSIE 6.0, FireFox 1.0, Opera 8.01

а если у меня имеется форма и требуется послать все поля из этой формы .. мне как, упаковывать все данные в виде строки: name1=value1&name2=value2?

Цитата

а если у меня имеется форма и требуется послать все поля из этой формы .. мне как, упаковывать все данные в виде строки: name1=value1&name2=value2?

Да. Каждому элементу формы можно дать id, затем при нажании на опр. кнопку на которую мы повесим функцию, которая пробежит по всем полям формы.

Код

var name1 = document.getElementById(id).value;

а затем сформируем переменную data

Код

url = 'name.php'; data = 'name1='+name1+'&name2='+name2 и т.д.

затем все данные скормим приведенному выше скрипту.

Код

ReLoad(url,data);

Цитата(PHP @ 19.6.2005, 01:08)

Да. Каждому элементу формы можно дать id, затем при нажании на опр. кнопку на которую мы повесим функцию, которая пробежит по всем полям формы.

не вряд ли лучше по-другому получить элементы.. через массив form[]
но вопрос в другом: отправятся ли данные если:
а) много полей
б) большой объем информации, например текст (содержащий переход на новую строку)

Irokez

Цитата

лучше по-другому получить элементы.. через массив form[]

ну это кто во что горазд

Цитата

отправятся ли данные если много полей

да отправятся.

Цитата

например текст (содержащий переход на новую строку)

необходимо преобразовать в UTF-8, иначе будут глюки.

Необходимо каждое поле формы пропустить через:
encodeURIComponent(element);

а затем сформировать date где все данные скрепить через &
но не надо саму переменную date пропускать через encodeURIComponent(element);

Цитата(PHP @ 19.6.2005, 01:39)

а затем сформировать date где все данные скрепить через & но не надо саму переменную date пропускать через encodeURIComponent(element);

т.е. data..
а ошибки 414 too long request не будет?

Кодом всё сказанное выше:

Код

<form id="test"> <input type="text" name="tt"> <input type="checkbox" name="ch" value="bla bla"> <input type="radio" name="rd" value="r1"> <input type="radio" name="rd" value="r2"> <input type="radio" name="rd" value="r3"> <input type="button" onclick="alert(encodeForm(this.form));" value="test"> </form> <script type="text/javascript"> <!-- // Скрипт для отправки запросов на сервер без обновления страницы методом POST. // Author: PHP-DIRECTOR <[email protected]> //  // getInputValue and encodeForm by Sardar <[email protected]> // // Протестировано в IE 6.0, FireFox 1.0, Opera 8.01 function createRequestObject() {   if (window.XMLHttpRequest) return new XMLHttpRequest();   try {     return new ActiveXObject('Msxml2.XMLHTTP');   } catch(e) {     return new ActiveXObject('Microsoft.XMLHTTP');   } } function ReLoad(url ,data) {  var Req = createRequestObject();  Req.onreadystatechange = function(){if(Req.readyState==4&&Req.status==200) { alert(Req.responseText); }};  Req.open('POST',url,true);  Req.setRequestHeader("Content-Type","application/x-www-form-urlencoded");  Req.send(data); } function encodeForm(form) {   if(!form||!form.elements) throw "encodeForm: error, argument is not a FORM";   var ret=[], el;   for(var i=0; i<form.elements.length; i++) {     el=form.elements[i];     if("checkboxradio".indexOf(el.type)>=0) {if(el.checked) ret[ret.length]=getInputValue(el);}     else if(el.type!="button"&&el.type!="submit") ret[ret.length]=getInputValue(el);   }   return ret.join("&"); } function getInputValue(inp) {   if(typeof(inp.nodeName)=="undefined") { //collection of radio     for(var i=0; i<inp.length; i++)       if(inp[i].checked) return (inp[i].name? encodeURIComponent(inp[i]).name+"=":"") + encodeURIComponent(inp[i].value);     return "";   }   if(inp.type=="select-multiple") {     var ret=[];     for(var i=0; i<inp.options.length; i++)       if(inp.options[i].selected) ret[ret.length]=(inp.options[i].name? encodeURIComponent(inp.options[i].name)+"[]=":"")+encodeURIComponent(inp.options[i].value);     return ret.join("&");   } else if(inp.type=="select-one")      return (inp.selectedIndex>=0)?        ((inp.options[inp.selectedIndex].name? encodeURIComponent(inp.options[inp.selectedIndex].name)+"=":"")+encodeURIComponent(inp.options[inp.selectedIndex].value)) : "";   if(inp.type=="image") return (inp.name? encodeURIComponent(inp.name)+"=":"")+encodeURIComponent(inp.src);   else return (inp.name? encodeURIComponent(inp.name)+"=":"")+encodeURIComponent(inp.value); } setInterval('ReLoad("name.php",encodeForm(document.getElementById("test")))', 5000); //--> </script>

Добавлено @ 02:32

Цитата(Irokez @ 19.6.2005, 01:05)

а ошибки 414 too long request не будет?

Данные постом идут, там хоть мегабайты.

Sardar то что нужно! спасибо!

Замечательный код. Есть только вопрос насчёт копирайта, о котором говорится в первом посте (я в этой теме не проф, поэтому прошу извинить, если кого-то случайно обидят мои рассуждения).
Насколько я понимаю первый скрипт отличается от обычно-используемого для httpRequest-запросов тем, что в него добавлена строка для Оперы:
var obj = new ActiveXObject('Msxml2.XMLHTTP');
, а также нехитрая функция setInterval().
В чём же такая изюминка этого скрипта, чтобы предупреждать (хоть и желательно) автора об его использовании?
Неужели настолько оригинальная идея?

Burrr
Используй PM для задания таких вопросов, IMHO.

Burrr изначальный код это стандартный, везде описываемый пример, можешь написать "с нуля" сам и поставить свой копирайт
Доработанный мной код это уже оригинальная идя. Я придумал и реализовал идею, но это не значит что код накладывает какие либо ограничения на использование. Можешь написать по новой сам, либо взять приведённый код. Во втором случае просто добавь имена и мыло тех, кто работал над кодом, просто из уважения.

Ясно, спасиба!
Просто интересно было узнать.

Это сообщение отредактировал(а) Burrr - 5.9.2005, 10:07

стоп...
что то вы меня запутали

Sardar
а в чем разница между громоздким кодом который описан, у Котерова(JSHttpRequest), твоим JSInteractiveRequest или компактным этим?

кроме метода передачи, разницы не вижу...
и там и там обновление страницы...

Цитата(Guest @ 17.11.2005, 13:43)

а в чем разница между громоздким кодом который описан, у Котерова(JSHttpRequest), твоим JSInteractiveRequest или компактным этим?

В поддержке браузерами. Например мой код не будет работать в Opere 8 и Netscape 8, т.к. те категорически отказываються запускать динамически созданные скрипты, вернее запускают, но аргументы убиваються. Это никак не обходиться, только использованием XMLHttpRequest вместо этого. В либе Котерова как раз такой подход реализован, если есть возможность использовать XMLHttpRequest, то он и используеться, иначе альтернативный способ скриптами.

В коде DIRECTOR используеться только XMLHttpRequest.

Как вывод: либа Котерова вобрала в себя оба подхода тем самым может работать почти везде, хотя плата за это немного разбухшим кодом. Все кто спрашивает динамику, советую именно её, т.к. свою никак не добью, нет времени

Sardar
добивай свою...
у Котеровской возникает проблема у пользователей ИЕ5... кодировка

Код

var xmlhttp=false; /*@cc_on @*/ /*@if (@_jscript_version >= 5) // JScript gives us Conditional compilation, we can cope with old IE versions. // and security blocked creation of the objects.  try {   xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");  } catch (e) {   try {    xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");   } catch (E) {    xmlhttp = false;   }  } @end @*/ if (!xmlhttp && typeof XMLHttpRequest!='undefined') {   xmlhttp = new XMLHttpRequest(); }

Здрасте...
Взято тут http://jibbering.com/2002/4/httprequest.html , только обязателно найдите (на этой же странице) условия копирайта и строжайше им следуйте. Только ищите их хорошо.

Цитата

Здрасте...

Иль кусочек кода инициализации XMLHttpRequest приводиться в любой статье, накладывать на такой код копирайт, всё равно что накладывать копирайт на:

Код

var a=new Image(); a.src=...

Цитата(fregs @ 18.11.2005, 08:09)

у Котеровской возникает проблема у пользователей ИЕ5... кодировка

fregs oн пошёл по пути раскодирования %uHHHH мнемоник юникода или отключения его вовсе, что приводит к кракозябрам в определённых ситуациях. Я кодирую текст в UTF-8, затем обычним urlencode, что больше по трафику, но надёжней.

Добью не ранее января, ибо работы не мерянно, да и к тому времени "отточиться" техника XMLHttpRequest под Оперой.

2 Sardar

кстати время добить не нашлось?

[offtop]
Прямо аврал
Ещё сессия, у нас она январь-февраль, сдача проекта и начало стажа. На форум на час прибегаю что бы только мусор почистить, в новичкас уже целая страница где я не был ещё

Остро не хватает активного комодератора, не то что софтину дописывать. Юзать я её буду не ранее марта, тогда и возрожу. Пожалуйста используйте JSHttpRequest от Котерова, хороший проверенный софт.
[/offtop]

Кто-нить в курсе как отправить input-поле типа file методом POST через XMLHttpRequest ?

Здесь в форуме ряд тем об этом но ни в одной не достигли успеха, пришли к выводу, что не идёт. Но в Mozilla/XUL что-то получилось, судя по теме в http://xpoint.ru/forums/programming/XUL/thread/27174.xhtml

Увидел что это реализовано на eBay при загрузке изображений. Загружаются без обновления страницы. Работает и в IE, и в Лисе, и в Опере. Буду разбираться как это сделано...

Через фреймы, иначе бы не работало.

я очень начинающий по JavaScript, и могу покозаться не ламером.....гы.. но будте бодры ответить мне на следующее...>>>
а что нжно изменить в коде (сообщение 1) , что бы он грузил мой файл, который мне нужен? и еще... какие-то там переменные name1, name2 , value1 & value2??? одним словом, мне нужен код чтоб делал все то, что по этой ссылке >> http://forum.vingrad.ru/index.php?act=ST&a...26&unread=1

Это сообщение отредактировал(а) 244760100 - 26.3.2006, 15:19

В работу. Тут не коды пишут, а помогают ВАМ их написать.

ну значит, если не трудно, помогите....

Афтор, зачОт! Давно меня волновал этот вопрос. Но тут у меня еще несколько-ко вопросов.

Какой код будет для запроса страницы, не отправляю POST. Просто я только вчера начал изучать JS, переделываю скрипт слоев, посему не очень соображаю, особенно в этих новых технологиях ;)

P.S. Не интересуют ответы типо "Ничего не пиши в POST" и т.д. Меня интересует более компактный код.