Bagaimana untuk Mengisi Senarai Dropdown Bergantung Secara Dinamik Menggunakan jQuery, AJAX, PHP dan MySQL?

Populasi Senarai Dropdown Dinamik Menggunakan jQuery/AJAX dan PHP/MySQL

Dalam contoh ini, kami menyasarkan untuk mencipta satu set dua senarai juntai bawah, di mana pilihan dropdown kedua diisi secara dinamik berdasarkan pemilihan dalam menu lungsur pertama.

Skrip jQuery/AJAX:

$(function() {
  $("#item_1").change(function() {
    var group_id = $(this).val();

    $.ajax({
      type: "POST",
      url: "../../db/groups.php?item_1_id=" + group_id,
      dataType: "json",
      success: function(data) {
        // Clear previous options in the second dropdown
        $('select#item_2').empty();
        $('select#item_2').append('<option value="0">Select Option</option>');

        // Populate the second dropdown
        $.each(data.subjects, function(i, val) {
          $('select#item_2').append('<option value="' + val.id + '">' + val.name + '</option>');
        });
        $('select#item_2').focus();
      },
      beforeSend: function() {
        $('select#item_2').empty();
        $('select#item_2').append('<option value="0">Loading...</option>');
      },
      error: function() {
        $('select#item_2').attr('disabled', true);
        $('select#item_2').empty();
        $('select#item_2').append('<option value="0">No Options</option>');
      }
    });
  });
});

Skrip PHP:

<?php
require_once('../includes/connect.php');

$item_1_id = $_GET['item_1_id'];

$dbh = get_org_dbh($org_id);

$return_arr = array();

$sth = $dbh->query("SELECT id, name, level 
                     FROM groups
                     WHERE level = '2'
                     AND parent = $item_1_id
                     GROUP by name
                     ORDER BY name");

while ($row = $sth->fetch()) {
  $row_array = array("name" => $row['name'], "id" => $row['id']);
  array_push($return_arr, $row_array);
}

echo json_encode($return_arr);
?>

Penanda HTML:

<label>

Atas ialah kandungan terperinci Bagaimana untuk Mengisi Senarai Dropdown Bergantung Secara Dinamik Menggunakan jQuery, AJAX, PHP dan MySQL?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!