Question

示例数据库

Location
    location_id     location
    1           Bacolod
    2           Bohol
    3           Cebu
    4           Manila

School

id      location_id     School_name
1           1               Bacolod Tay Tung High School
2           3               University of Southern Philippines Foundation
3           2               Dr. Cecilio Putong National High School
4           1               Jack and Jill School
5           4               British School Manila
6           2               Holy Spirit School of Tagbilaran
7           4               Chinese International School Manila
8           2               Ubay National Science High School
9           3               Abellana National School


<select onChange="jsFunction()" id="team1" >
@foreach($locations as $location)
<option onclick="jsFunction()">{!! $location->location_name!!}</option>
@endforeach
</select>


<select id="team2">
<option>Computer Science</option>
<option>Mathematics</option>
<option>Bioinformatic</option>
<option>Management Sciences</option>
</select>

<script>
function jsFunction(){
    var team1 = document.getElementById( "team1" );
    var team2 = document.getElementById( "team2" );
    for (i=0;i<4;i++){
        team2.remove(0);
    }
    var position=0;
    for (i=0;i<4;i++){
        if (i!=team1.selectedIndex){
            team2.options[position] = new Option(team1.options[i].value);
            position=position+1;
        }
    }
}
</script>

我有这两个下拉选项，其中第一个下拉列表是持有者或曾经点击的类别，属于此的列表将显示它。例如，根据数据库值，如果我选择宿务，所有属于宿务的学校将显示在第二个下拉列表中。不要介意我当前的脚本，因为它是错误的。代码必须要有多个数据，所以第二个下拉列表必须显示所有数据而不仅仅是限制查看4项。我对javascript并不是很熟悉。任何人都可以帮我构建javascript吗？请不要使用AJax，因为它对我来说更复杂。

Answer 1

你可以参考 my document in here

两个选择下拉列表，包含JavaScript中的类别

1 个答案: