ホームページ >バックエンド開発 >PHPチュートリアル >PHP と AJAX を使用して、動的にデータが入力される依存ドロップダウン ボックスを作成する方法
動的に入力されるドロップダウン ボックス
この例では、2 番目のドロップダウンのオプションが含まれる動的ドロップダウン ボックスを作成することを目的としています。ボックスは、最初のドロップダウン ボックスでの選択内容に応じて異なります。
これは、コード:
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;
この例では、オプション2 番目のドロップダウン ボックスの値は、最初のドロップダウン ボックスで選択された値に基づいて動的に設定されます。カテゴリ テーブルが変更され、2 番目のドロップダウン ボックスのオプションをグループ化するためのマスター フィールドが追加されます。
以上がPHP と AJAX を使用して、動的にデータが入力される依存ドロップダウン ボックスを作成する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。