Проблемы с PHP POST через AJAX в форме Bootstrap 4

Question

Я работаю над сайтом для клиента, который основан на бесплатном шаблоне Bootsrap 4 под названием «агентство».Они также предоставляют простую контактную форму с использованием стандартной формы начальной загрузки, которая отправляет данные в файл .js для предварительной обработки, а затем сообщение отправляется POST (с помощью вызова AJAX) в сценарий Server PHP, который фактически отправляет почту.

Моя проблема: отправляются все данные формы, кроме записей в раскрывающемся элементе.

Один пример раскрывающегося списка:

 <label for="adults">Erwachsene</label>
 <select name="adults" class="form-control" id="adults">
    <option value="keine">0</option>
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
    <option value="4">4</option>
    <option value="5">5</option>
 </select>

1. Форма не имеет никакого действия - как JS.Сценарий вызывается при нажатии кнопки «Отправить» (поведение по умолчанию запрещено)
2. Значения формы НЕ Сериализуются, все они собираются один за другим с $(select#inputID).val()
3. Это ненезависимо от того, используется ли document.getElementById(#inputID).value или любой другой вызов
4. Данные передаются в стандартном вызове:

  $.ajax({
                url: "././mail/contact_me.php",
                type: "POST",
                dataType: "json",
                data: {
                    "name": name,
                    "email": email,
                    "street": street,
                    "number": number,
                    "place": place,
                    "postal": postal,
                    "phone": phone,
                    "adults": adults,
                    "children": children,
                    "flat": flat,
                    "startDate": startDate,
                    "endDate": endDate,
                    "dog": dog,
                    "sheets": sheets,
                    "towels": towels,
                    "message": message
                },
                cache: false,
                success: function () {
                    // Success message
                    $('#success')
                        .html("<div class='alert alert-success'>" +
                            "<button type='button' class='close' data-dismiss='alert' aria-hidden='true'></button>" +
                            "<strong>Vielen Dank, Ihre Anfrage wurde verschickt.</strong>" +
                            "</div>");
                    //clear all fields
                    $('#contactForm').trigger("reset");
                },
                error: function () {
                    // Fail message
                    $('#success').html("<div class='alert alert-danger'>" +
                        "<button type='button' class='close' data-dismiss='alert' aria-hidden='true'></button>" +
                        "<strong>Sorry, deine Mail konnte nicht versandt werden</strong>" +
                        "</div>");
                    //clear all fields
                    $('#contactForm').trigger("reset");
                },
                complete: function () {
                    setTimeout(function () {
                        $this.prop("disabled", false); // Re-enable submit button when AJAX call is complete
                    }, 1000);
                }
            });

Файл php не делает ничего, кроме: $name = htmlspecialchars($_POST["name"]); и помещает его в тело письма. Я получаю почту, и все элементы «не выпадающие» находятся там console.log () и браузерный доступ к раскрывающимся значениям работает как чудо, поэтому не должно быть глупой синтаксической ошибки или чего-либо (также пытался .toString() каждое поле перед вызовом ajax)

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

Заранее спасибо!

РЕШЕНИЕ, как рекомендовано вкомментарии: используйте getElementById ().Я только что сделал функцию для получения выпадающих значений:

function getDDValue(id) {
  let dropdown = document.getElementById(id);
  return dropdown ? dropdown.options[dropdown.selectedIndex].value : id + " nicht gefunden!";
}

// the call
let adults_value = getDDValue('adults');
```

Answer 1

Для получения выбранного значения вы должны выбрать его из опции.

// get select box object
var adultsSelectBox = document.getElementById("adults");

// get selected option value
var adults = adultsSelectBox.options[adultsSelectBox.selectedIndex].value;

// get selected option text
var adultsText = adultsSelectBox.options[adultsSelectBox.selectedIndex].text;


console.log(adults);

// ...
// then ajax request etc..