2 つのドロップダウン メニューを設定しようとしています。1 つは「コース」用で、もう 1 つは選択したコースに関連する「モジュール」用です。
「コース」ドロップダウンメニューが正常に機能するようになりました。問題は、「モジュール」ドロップダウン メニューです。「コース」ドロップダウンメニューからコースを選択すると、選択したコースに関連するモジュールが「モジュール」ドロップダウンメニューに表示されます。しかし、代わりに、「モジュール」ドロップダウンメニューの「選択してください」オプションのみが表示されています。
関連するモジュールを「モジュール」ドロップダウン メニューに表示するにはどうすればよいですか?
以下は、「コース」ドロップダウンメニューと「モジュール」ドロップダウンメニューのセットアップを表示するコードです。関連するものを見つけてリストする「module.php」ファイルにリンクするjqueryが含まれています「モジュール」ドロップダウンメニューのオプションとしてモジュール。
<?php
// connect to the database
include('connect.php');
/* check connection */
if (mysqli_connect_errno()) {
printf("Connect failed: %s\n", mysqli_connect_error());
die();
}
$sql = "SELECT CourseId, CourseName FROM Course";
$sqlstmt=$mysqli->prepare($sql);
$sqlstmt->execute();
$sqlstmt->bind_result($dbCourseId, $dbCourseName);
$courses = array(); // easier if you don't use generic names for data
$courseHTML = "";
$courseHTML .= '<select name="courses" id="coursesDrop" onchange="getModules();">'.PHP_EOL;
$courseHTML .= '<option value="">Please Select</option>'.PHP_EOL;
while($sqlstmt->fetch())
{
$course = $dbCourseId;
$coursename = $dbCourseName;
$courseHTML .= "<option value='".$course."'>" . $course . " - " . $coursename . "</option>".PHP_EOL;
}
$courseHTML .= '</select>';
$courseHTML .= '</form>';
$moduleHTML = "";
$moduleHTML .= '<select name="modules" id="modulesDrop">'.PHP_EOL;
$moduleHTML .= '<option value="">Please Select</option>'.PHP_EOL;
$moduleHTML .= '</select>';
?>
<script type="text/javascript">
function getModules() {
var course = jQuery("#CoursesDrop").val();
jQuery('#modulesDrop').empty();
jQuery('#modulesDrop').html('<option value="">Please Select</option>');
jQuery.ajax({
type: "post",
url: "module.php",
data: { course:course },
success: function(response){
jQuery('#modulesDrop').append(response);
}
});
}
</script>
以下は、module.php ページです。
<?php
// connect to the database
include('connect.php');
/* check connection */
if (mysqli_connect_errno()) {
printf("Connect failed: %s\n", mysqli_connect_error());
die();
}
$course = isset($_POST['course']) ? $_POST['course'] : '';
$sql = "
SELECT cm.CourseId, cm.ModuleId,
c.CourseName,
m.ModuleName
FROM Course c
INNER JOIN Course_Module cm ON c.CourseId = cm.CourseId
JOIN Module m ON cm.ModuleId = m.ModuleId
WHERE
(c.CourseId = ?)
ORDER BY c.CourseName, m.ModuleId
";
$sqlstmt=$mysqli->prepare($sql);
$sqlstmt->bind_param("s",$course);
$sqlstmt->execute();
$sqlstmt->bind_result($dbCourseId,$dbModuleId,$dbCourseName,$dbModuleName);
$moduleHTML = "";
while($sqlstmt->fetch()) {
$moduleHTML .= "<option value='$dbModuleId'>" . $dbModuleId . "</option>".PHP_EOL;
}
echo $moduleHTML;
$sqlstmt->execute();
?>