两个 select 下拉列表,类别在 JavaScript 中
Two select drop-down with category in JavaScript
样本数据库
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>
我有这两个下拉列表 select 其中第一个下拉列表是持有人或点击一次的类别,属于这个的列表
将从数据库值中显示 it.For 个示例库,如果我 select 宿务,所有属于宿务的学校都应显示在第二个下拉列表中。
不要介意我当前的脚本,因为它是 wrong.The 代码必须期望多个数据,因此第二个下拉列表必须显示所有数据,而不仅仅是限制
视图到 4 个项目。
我不太熟悉 javascript.Anyone 可以帮助我构建 javascript 吗?请不要 AJax 因为它对我来说更复杂。
您可以参考
my document in here.
样本数据库
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>
我有这两个下拉列表 select 其中第一个下拉列表是持有人或点击一次的类别,属于这个的列表 将从数据库值中显示 it.For 个示例库,如果我 select 宿务,所有属于宿务的学校都应显示在第二个下拉列表中。 不要介意我当前的脚本,因为它是 wrong.The 代码必须期望多个数据,因此第二个下拉列表必须显示所有数据,而不仅仅是限制 视图到 4 个项目。 我不太熟悉 javascript.Anyone 可以帮助我构建 javascript 吗?请不要 AJax 因为它对我来说更复杂。
您可以参考 my document in here.