Your <select> tag is inside the loop so the code produces a select element for each iteration of the loop.
Try this:
<div class="select" id="new-input" onselect="SelectStudents()">
<select required>
<?php foreach ($arr['data'] as $key => $value) {
echo '<option value="'.$value['studentName'].'">';
echo $value['studentName'];
echo '</option>';
} ?>
</select>
</div>
As far as changing DOM elements on list select: it is probably better to use JavaScript. But if you have to do it serverside, here is an idea for a function you can use to help you:
function getStudents($teacherID, $arr) {
foreach ($arr as $key => $record) {
if ($record['TeacherID'] == $teacherID){
return $record['StudName'];
}
}
}
I expect if I click Miss Sara from the menu, it will load students' name under Miss Sara (which is Nina Simon) on dropdown menu.
So based on my understanding, you want something like this.
- I have used some assumptions about what's going on.
- I hardcoded data as a php variable.
- The original question was about foreach loop, so I used those a lot.
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style type="text/css">
a{
display: block;
margin-bottom: 1rem;
}
.card{
padding: 1rem;
background-color: #eee;
width: 300px;
}
select{
margin-top: 1rem;
width: 300px;
}
</style>
</head>
<body>
<?php
class StudentsClass
{
public function listStudents($teacherID, $arr) {
foreach ($arr as $key => $record) {
if ($record['TeacherID'] == $teacherID){
return $record['StudName'];
}
}
}
public function listTeachers($arr) {
$s=[];
foreach ($arr as $key => $record) {
$s[$record['TeacherID']] = $record['TeacherName'];
}
return $s;
}
}
class DisplayHTML
{
public function selectHTML($list,$cssClass='') {
$s='';
if ($cssClass!='') $css = 'class="'.$cssClass.'" ' ; else $css = '';
foreach ($list as $key => $item) {
$s.='<option '.$css.'value="'.$item.'">'.$item.'</option>';
}
$s = '<select>'.$s.'</select>';
return $s;
}
public function anchorHTML($list,$cssClass='') {
$s='';
if ($cssClass!='') $css = 'class="'.$cssClass.'" ' ; else $css = '';
foreach ($list as $key => $item) {
$s.='<a '.$css.'href="?teacherID='.$key.'">'.$item.'</a>';
}
return $s;
}
public function divHTML($id,$data) {
$s='<div class="card"> <h2>My Student list</h2><ul id="studentlist"> </ul>';
foreach ($data as $key => $item) {
if ($item['TeacherID']==$id){
foreach ($item['StudName'] as $k => $value) {
$s.='<li>'.$value.'</li>';
}
$s.='<h3>'.$item['TeacherName'].'</h3></div>';
return $s;
}
}
return '<div class="card">
<h2>My Student list</h2><ul><li>-</li></ul>
<h3>--</h3> </div>';
}
}
$arr = [
[
"TeacherID"=> "123",
"TeacherName"=> "Miss Sara",
"StudName"=> ["Nina","Simon"],
],
[
"TeacherID"=> "124",
"TeacherName"=> "Madam Downy",
"StudName"=> ["Mike","Dave"],
],
[
"TeacherID"=> "125",
"TeacherName"=> "Mr. Adam",
"StudName"=> ["Jenny","William"],
]
];
$stlst = new DisplayHTML;
$stdents = new StudentsClass;
echo $stlst->anchorHTML($stdents->listTeachers($arr));
if (isset($_GET['teacherID'])) {
echo $stlst->divHTML($_GET['teacherID'],$arr);
echo $stlst->selectHTML($stdents->listStudents($_GET['teacherID'],$arr));
}
?>
</body>
</html>
