Сохраняйте и отправляйте входные данные из любой формы веб-сайта, используя Javascript, на веб-крючок

Question

У меня есть блок кода Javascript, который я пытаюсь настроить для отправки захваченных данных формы в веб-крючок.

var name = document.getElementById("pwebcontact1_field-name").value;
var email = document.getElementById("pwebcontact1_field-email").value;
var phone = document.getElementById("pwebcontact1_field-phonenumber").value;
var zillow = document.getElementById("pwebcontact1_field-yourzillowprofilelinkcopyandpastehere").value;

var data = {
name: name.value,
email: email.value,
phone: phone.value,
zillow: zillow.value
};

$.ajax({
url: 'url',
method: 'POST',
contentType: 'application/json',
crossDomain: true,
headers: {
    'authkey': 'key'
},
data: JSON.stringify(data)    
})
.success(function(response) {
console.log(response);
});

URL и authkey настроены.Веб-крючок уведомил, но тело пусто.Пример, который предлагает издатель ловушки для размещения тела:

"data": "{\"hello\":\"world\"}"

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

Спасибо!

Answer 1

Огромное спасибо @Zhulien, исправленный код, который работает:

var name = document.getElementById("pwebcontact1_field-name").value;
var email = document.getElementById("pwebcontact1_field-email").value;
var phone = document.getElementById("pwebcontact1_field-phonenumber").value;
var zillow = document.getElementById("pwebcontact1_field-yourzillowprofilelinkcopyandpastehere").value;

var data = {
 data: {
    name: name,
    email: email,
    phone: phone,
    zillow: zillow
 }
};

$.ajax({
 url: 'YOUR_URL',
 method: 'POST',
 contentType: 'application/json',
 crossDomain: true,
 headers: {
  'authkey': 'x'
 },
data: JSON.stringify(data)    
})
.success(function(response) {
console.log(response);
});

Это способ хранения и отправки полей ввода данных из любой формы веб-сайта для отправки в веб-крючок!

Answer 2

Во-первых, проверьте, используете ли вы правильные идентификаторы для элементов везде.Если да, попробуйте следующее:

var name = document.getElementById("pwebcontact1_field-name").value;
var email = document.getElementById("pwebcontact1_field-email").value;
var phone = document.getElementById("pwebcontact1_field-phone").value;
var zillow = document.getElementById("pwebcontact1_field-zillow").value;

var data = {
    name: name,
    email: email,
    phone: phone,
    zillow: zillow
};

$.ajax({
    url: 'YOUR_URL',
    method: 'POST',
    contentType: 'application/json',
    crossDomain: true,
    headers: {
        'authkey': 'x'
    },
    data: JSON.stringify(data)    
})
.success(function(response) {
    console.log(response);
});

Вы должны позаботиться о проверке своих входных данных.

---

РЕДАКТИРОВАТЬ после комментария:

Вы используете неправильные идентификаторы в выборе.Используйте приведенный выше код, но поменяйте местами назначения переменных «phone» и «zillow»:

var phone = document.getElementById("pwebcontact1_field-phonenumber").value;
var zillow = document.getElementById("pwebcontact1_field-yourzillowprofilelinkcopyandpastehere").value;

---

РЕДАКТИРОВАТЬ после комментария 2: Скорее всего, конечная точка, в которой вы находитесьотправка сообщения не может правильно проанализировать тело запроса.Возможно это ожидает другую структуру или формат (тип пантомимы).Принимая во внимание ваш комментарий о том, как автор предложил отправлять данные, и приведенный пример, мы исключаем проблему с типом mime и считаем само собой разумеющимся, что это JSON.Так же и в структуре.Нам нужно обернуть текущий объект данных (свойства данных) в свойство «data».

Попробуйте:

var data = {
    data: {
        name: name,
        email: email,
        phone: phone,
        zillow: zillow
    }
};