いくつかのテキスト入力の下と下にドロップダウンメニューがあります。私がやろうとしているのは、ドロップダウンメニューからコースを選択すると、テキスト入力で選択されたコースの関連詳細が表示されることです。しかし、テキスト入力には何も表示されていません。現在、エラーは発生していませんが、コースの詳細がテキスト入力に表示されないため、コードで何か間違ったことをしていると思います。テキスト入力に表示される詳細を取得するにはどうすればよいですか?
以下は、ドロップダウンメニューと各コースの期間を取得するmysqliコードです。
$coursequery = "
SELECT CourseId, CourseNo, CourseName, Duration, CourseActive
FROM Course
WHERE
(CourseActive = ?)
ORDER BY CourseNo
";
... //mysqli prepare
$courseqrystmt->execute();
$courseqrystmt->bind_result($dbCourseId, $dbCourseNo, $dbCourseName, $dbCourseDuration, $dbCourseActive);
$courseqrystmt->store_result();
$coursenum = $courseqrystmt->num_rows();
$courseHTML = '';
$courseHTML = '<select name="course" id="coursesDrop">'.PHP_EOL;
$courseHTML .= '<option value="">Please Select</option>'.PHP_EOL;
$studentInfo = array();
$courseInfo = array();
while ( $courseqrystmt->fetch() ) {
$courseHTML .= sprintf("<option value='%s'>%s - %s</option>", $dbCourseId, $dbCourseNo, $dbCourseName) . PHP_EOL;
$courseData = array();
$courseData["Duration"] = $dbCourseDuration;
array_push($courseInfo, $courseData);
}
$courseHTML .= '</select>';
以下は、テキスト入力のコードです。
$editsession = "
<form id='updateForm'>
<p><strong>Course Chosen:</strong></p>
<table>
<tr>
<th></th>
<td><input type='hidden' id='currentId' name='Idcurrent' readonly='readonly' value='' /> </td>
</tr>
<tr>
<th>Course No:</th>
<td><input type='text' id='currentCourseNo' name='CourseNocurrent' readonly='readonly' value='' /> </td>
</tr>
<tr>
<th>Course Name:</th>
<td><input type='text' id='currentCourseName' name='CourseNamecurrent' readonly='readonly' value='' /> </td>
</tr>
<tr>
<th>Duration:</th>
<td><input type='text' id='currentDuration' name='Durationcurrent' readonly='readonly' value='' /> </td>
</tr>
</table>
</form>
";
echo $editsession;
以下は、コースドロップダウンメニューから選択されたコースに応じて、テキスト入力にデータを表示するjqueryコードです。
$(document).ready( function(){
var courseinfo = <?php echo json_encode($courseInfo);?>;
$('#coursesDrop').change( function(){
$('#targetdiv').hide();
var courseId = $(this).val();
if (courseId !== '') {
for (var i = 0, l = courseinfo.length; i < l; i++)
{
if (courseinfo[i].CourseId == courseId) {
var currentindex = $('#currentDuration').val(courseinfo[i].Duration);
var text = $(this).find('option:selected').text();
var split = text.split(' - ');
$('#currentId').val($(this).find('option:selected').val());
$('#currentCourseNo').val( split[0] );
$('#currentCourseName').val( split[1] );
break;
}
}
}
else{
$('#currentCourseNo,#currentCourseName,#currentDuration,#currentId,#studentselect').val('');
}
});
$('#courseForm').delegate('change','select',(function(warnings)
{
return function()
{
warnings.html('');
};
}($('#warnings'))));
});