Как добавить опцию для выбора формы, полученной из запроса AJAX в PHP

Question

Что такое метод добавления опции для выбора данных блока, полученных AJAX

HTML:

<select id="options"></select>

JQuery:

$.ajax({
  type: "POST",
  url: "ajax/addCustDetail.php",
  data: {customerId},
  cache: false,
  success: function(html)
  {
    $("#options").html(html);
  } 
});

Answer 1

Есть два способа сделать это:

1. Возвращая строку из addCustDetail.php как:

   $response = '<option value="1">One</option><option value="2">Two</option>';
   

и этот $response возвращается, в этом случае вы можете просто использовать его в jquery, например:

    $("#options").html(html);

2. Если вы возвращаете массив json из addCustDetail.php, в этом случае вы анализируете его в jquery, повторяете его и создаете параметры, а затем добавляете их в выборку.

Answer 2

PHP Side Code:

$cid=$_POST['cid'];
$query="SELECT * from customer_shipping_address WHERE STransNo=$cid";        
$result1 = mysqli_query($con, $query);
while ($row = mysqli_fetch_array($result1, MYSQLI_ASSOC)) {
    echo "<option value=".$row['TransSlNo'].">".$row['ShipName']."</option>" ;   
}

Answer 3

Вы можете добавлять дочерние элементы к элементу выбора следующим образом:

Сначала добавьте идентификатор к элементу выбора:

<select id="myselect"></select>

Затем добавьте детей так:

var selectElement = document.getElementById("myselect");
var newOption = document.createElement("option");
newOption.innerHTML = "New option!";
selectElement.appendChild(newOption);

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

for(let i = 0; i < 7; i++) {
   var newOption = document.createElement("option");
   newOption.innerHTML = response[i].name;
   newOption.setAttribute("value", response[i].value);
   selectElement.appendChild(newOption);
}