[英]Populate Drop Down Dynamically
I am looking for a little bit of help with automatically population drop down menus dynamically. 我正在寻找有关自动自动填充下拉菜单的帮助。
The code I have written just will not work for me, but it did at first and has now stopped. 我编写的代码对我来说不起作用,但起初确实如此,现在已停止。
Where am I going wrong? 我要去哪里错了?
HTML: HTML:
<form id="booking_form" onsubmit="return checkForm()" method="post" action="">
<div>
<!-- Select Movie -->
<span class="label">Movie Name:</span>
<select name="movie" id="movie_name" onChange="changeday(this.value);">
<option value="" disabled selected>Choose Movie</option>
<option value="SW">Star Wars: The Force Awakens</option>
<option value="WC">Wedding Crashers</option>
<option value="GD">The Good Dinosaur</option>
<option value="BR">Battle Royale</option>
</select>
</div>
<div>
<!-- Select Day -->
<span class="label">Session Day:</span>
<select name="day" id="session_day">
<option value="" disabled selected>Please Select a Movie</option>
</select>
</div>
</form>
JavaScript: JavaScript:
var moviesByDays = {
SW: ["Monday", "Monday", "Monday", "Monday"],
WC: ["Tuesday", "Tues", "Tues", "Tues"],
GD: ["Wednesday", "Wed", "Wed", "Wed", "Wed"],
BR: ["Thursday", "Thurs", "Thurs", "Thurs", "Thurs"]
}
function changeday(value) {
if (value.length == 0) document.getElementById("session_day").innerHTML = "<option></option>";
else {
var catOptions = "";
for (session_dayId in moviesByDay[value]) {
daysOptions += "<option>" + moviesByDays[value][session_dayId] + "</option>";
}
document.getElementById("session_day").innerHTML = daysOptions;
}
}
How can I make this work? 我该如何进行这项工作?
Thanks in advance for the help. 先谢谢您的帮助。
That is because you have made some mistakes in variable and assignments. 那是因为您在变量和赋值上犯了一些错误。 Use below in
Script
tag: 在
Script
标记中使用以下代码:
var moviesByDays = {
SW: ["Monday", "Monday", "Monday", "Monday"],
WC: ["Tuesday", "Tues", "Tues", "Tues"],
GD: ["Wednesday", "Wed", "Wed", "Wed", "Wed"],
BR: ["Thursday", "Thurs", "Thurs", "Thurs", "Thurs"]
}
function changeday(value) {
var daysOptions = []; //That will Clear first selection on every new selection
if (value.length == 0) document.getElementById("session_day").innerHTML = "<option></option>";
else {
var catOptions = "";
for (session_dayId in moviesByDays[value]) {
daysOptions += "<option>" + moviesByDays[value][session_dayId] + "</option>";
}
document.getElementById("session_day").innerHTML = daysOptions;
}
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.