이 예에서는 두 번째 드롭다운의 옵션이 있는 두 개의 드롭다운 목록 세트를 만드는 것을 목표로 합니다. 첫 번째 드롭다운의 선택 항목에 따라 동적으로 채워집니다.
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>'); } }); }); });
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); ?>
HTML 마크업:
<label>
위 내용은 jQuery, AJAX, PHP 및 MySQL을 사용하여 종속 드롭다운 목록을 동적으로 채우는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!