> 백엔드 개발 > PHP 튜토리얼 > PHP와 AJAX를 사용하여 동적으로 채워진 종속 드롭다운 상자를 만드는 방법은 무엇입니까?

PHP와 AJAX를 사용하여 동적으로 채워진 종속 드롭다운 상자를 만드는 방법은 무엇입니까?

Mary-Kate Olsen
풀어 주다: 2024-12-11 00:04:10
원래의
451명이 탐색했습니다.

How to Create Dynamically Populated Dependent Drop-Down Boxes Using PHP and AJAX?

동적으로 채워진 드롭다운 상자

이 예에서는 두 번째 드롭다운의 옵션이 포함된 동적 드롭다운 상자를 만드는 것이 목표입니다. 상자는 첫 번째 드롭다운 상자에서 선택한 항목에 따라 달라집니다.

다음은 수정된 버전입니다. 코드:

tester.php

<html>
    <head>
        <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
        <script type="text/javascript">
            $(function() {
                $('#stSelect').change(function() {
                    var sel_stud = $(this).val();
                    $.ajax({
                        type: "POST",
                        url: "another_php_file.php",
                        data: 'theOption=' + sel_stud,
                        success: function(whatigot) {
                            $('#LaDIV').html(whatigot);
                        }
                    });
                });
            });
        </script>
    </head>
<body>

    <select name="students">
로그인 후 복사

another_php_file.php

<?php
$server = 'localhost'; //localhost is the usual name of the server if apache/Linux.
$login = 'root';
$pword = '';
$dbname = 'test';
mysql_connect($server,$login,$pword) or die($connect_error); //or die(mysql_error());
mysql_select_db($dbname) or die($connect_error);

//Get value posted in by ajax
$sel_stud = $_POST['theOption'];

//Run DB query
if($sel_stud == "Electronics"){
    $query = "SELECT * FROM `category` WHERE `master` = 1";
}elseif($sel_stud == "Clothes"){
    $query = "SELECT * FROM `category` WHERE `master` = 2";
}else{
    $query = "SELECT * FROM `category` WHERE `master` = 3";
}
$result = mysql_query($query) or die('Fn another_php_file.php ERROR: ' . mysql_error());
$num_rows_returned = mysql_num_rows($result);

//Prepare response html markup
$r = '
        
        <select>
';

//Parse mysql results and create response string. Response can be an html table, a full page, or just a few characters
if ($num_rows_returned > 0) {
    while ($row = mysql_fetch_assoc($result)) {
        $r = $r . '<option value="' .$row['id']. '">' . $row['name'] . '</option>';
    }
} else {
    $r = '<p>No Items</p>';
}

echo $r;
로그인 후 복사

이 예에서 옵션은 두 번째 드롭다운 상자의 값은 첫 번째 드롭다운 상자에서 선택한 값에 따라 동적으로 채워집니다. 카테고리 테이블은 두 번째 드롭다운 상자에 옵션을 그룹화하기 위한 마스터 필드를 포함하도록 수정되었습니다.

위 내용은 PHP와 AJAX를 사용하여 동적으로 채워진 종속 드롭다운 상자를 만드는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
저자별 최신 기사
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿