XMLHttpRequest для публикации формы HTML
Текущая настройка
У меня есть форма HTML, как это.
Update
У меня может быть много таких форм на странице.
Мой вопрос
Как я могу отправить эту форму асинхронно и не перенаправить или обновить страницу? Я умею пользоватьсяXMLHttpRequest
, У меня есть проблема получения данных из HTML в javascript, чтобы затем поместить в строку запроса поста. Вот метод, который яв настоящее время использую для моего zXMLHttpRequest` 's.
function getHttpRequest() {
var xmlhttp;
if (window.XMLHttpRequest) {// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
} else {// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
return xmlhttp;
}
function demoRequest() {
var request = getHttpRequest();
request.onreadystatechange=function() {
if (request.readyState == 4 && request.status == 200) {
console.log("Response Received");
}
}
request.open("POST","post-handler.php",true);
request.setRequestHeader("Content-type","application/x-www-form-urlencoded");
request.send("action=dosomething");
}
Так, например, скажем, метод JavaScriptdemoRequest()
был вызван, когда формаНажата кнопка «Отправить», как получить доступ к форме?Значения из этого метода, чтобы затем добавить его в?XMLHttpRequest
РЕДАКТИРОВАТЬ
Пытаясь реализовать решение из ответа ниже, я изменил свою форму следующим образом.
Update
Однако при нажатии на кнопку, это 'все еще пытается перенаправить меня (туда, где яя не уверен) и мой метод неТ называется?
Слушатель событий кнопки
document.getElementById('updateBtn').addEventListener('click', function (evt) {
evt.preventDefault();
// Do something
updateProperties();
return false;
});