Отправка данных обработчику без перезагрузки

[dimjan4]

Добрый день!
Надо сделать так, чтобы данные с формы отправлялись обработчику без перезагрузки страницы...как реолизовать??


Есть php обраьотчик, на него посылаем переменные:
id_user, text


Выводить должен сообщение только в том случае, если возникла ошибка...а так выводилась бы пустая форма...

[Gvozd]

ajax

[dimjan4]

Я понял, что АЯКС, я задал вопрос: Как сделать...

[Gvozd]

http://javascript.ru/ajax
http://xmlhttprequest.ru/
после того как ознакомитесь, у вас отпадет куча вопросов

[dimjan4]

Я нашол такой пример:

var xmlhttp = getXmlHttp()
xmlhttp.open("GET", uri, false);
xmlhttp.send(null);
if(!xmlhttp.getResponseHeader("Date")) {  
  var cached = xmlhttp;
  xmlhttp = getXmlHttp()
  var ifModifiedSince = cached.getResponseHeader("Last-Modified");
  ifModifiedSince = (ifModifiedSince) ? ifModifiedSince : new Date(0); 
  xmlhttp.open("GET", uri, false);
  xmlhttp.setRequestHeader("If-Modified-Since", ifModifiedSince);
  xmlhttp.send(null);
  if(xmlhttp.status == 304)  {
    xmlhttp = cached;
  }
}

а вот как мне переделать код для своего случая?

[Gvozd]

ну и?
встраиваете в обработчик события onsubmit формы отправку данных на сервер.
не забудьте про return false в конце обработчика, иначе форма отправится все таки и обычным образом
данный код является синхронным, поэтому сразу после этого кода обрабатываем результат ответа от сервера.
но было бы лчше переделать его на асинхронный вариант, и использовать обработчик события onreadystatechange объекта xmlhttp

если вам непонятно ни слова из того что я написал, тогда марш учить азы

[dimjan4]

Смотрите, что я наделал:
Я понимаю, что сдесь груда ошибок...но помогите исправить...

<form action="" method="get" onSubmit="StartFcion ()">
	<input name="" type="text" id="text">
    <input name="submit" type="submit" value="&gt;&gt;ENTER&lt;&lt;">
</form>

function StartFcion () {
					var datas = document.getElementById ('text').value;
					var xmlhttp = getXmlHttp()
					xmlhttp.open("GET", uri, false);
					xmlhttp.send(null);
					if(!xmlhttp.getResponseHeader("Date")) {  
					  var cached = xmlhttp;
					  xmlhttp = getXmlHttp()
					  var ifModifiedSince = cached.getResponseHeader("Last-Modified");
					  ifModifiedSince = (ifModifiedSince) ? ifModifiedSince : datas; 
					  xmlhttp.open("GET", uri, false);
					  xmlhttp.setRequestHeader("If-Modified-Since", ifModifiedSince);
					  xmlhttp.send(null);
					  if(xmlhttp.status == 304)  {
						xmlhttp = cached;
					  }
					}
					return false;
			}

[vvsh]

я не понимаю что вы наделали, советую почитать вам сайт который Gvozd, вторая ссылка. Я почитал его и все понял и вам советую.

[Tim]

var request = false;

// Функция инициализация объекта для Ajax
function CreateRequest() {
  try {
    request = new XMLHttpRequest();
  } catch (trymicrosoft) {
    try {
      request = new ActiveXObject("Msxml2.XMLHTTP");
    } catch (othermicrosoft) {
      try {
        request = new ActiveXObject("Microsoft.XMLHTTP");
      } catch (failed) {
        request = false;
      }
    }
  }
  if (!request) { alert('Ошибка инициализации.'); }
}


// Функция отправки POST запроса
function POST_request()
{
	CreateRequest();
	
	var url = "/obrabotchik.php"; // URL для подключения (Ваш обработчик)
	
	request.open("POST", url, true);
	request.onreadystatechange = updatePage;
    request.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
	
	// Вытаскиваем значения из формы
	var id = document.getElementById("id_name").value;
	var user = document.getElementById("id_name").value;
	var text = document.getElementById("id_name").value;
	
	request.send("id=" + id + "&user=" + user + "&text=" + text); // Передаваемые параметры
	
	function updatePage() {
		if (request.readyState == 4)
        {
            if (request.status == 200)
            {
				// Вставляем ответ в div с id-ом "id_name"
				document.getElementById("id_name").innerHTML = request.responseText;
				
                delete request;
            }
            else { alert("Сервер не ответил"); }
        }
	}
}

<input type="submit" onclick="POST_request(); return false;" value="Submit">

[Riim]

Лучше на onsubmit формы повесить.