-1
I am mounting a Selection Menu where the user selects a month, when the month is selected, a next selection menu is displayed to choose a day. What I need to do now is: when the user selects the day, a video is displayed. In this case, there is a preset video for each day.
The . js function I have is:
jQuery(document).ready(function($) {
var arquivos = {
Janeiro: ["./videos/1.mp4", "./videos/2.mp4", "./videos/3.mp4", "./videos/4.mp4"],
Fevereiro: ["./videos/5.mp4", "./videos/6.mp4", "./videos/7.mp4", "./videos/8.mp4"],
}
var dias = {
Janeiro: ["Dia 6", "Dia 13", "Dia 20", "Dia 27"],
Fevereiro: ["Dia 3", "Dia 10", "Dia 17", "Dia 24"],
}
$("#mes").change(function() {
var selecionado = this.value;
var html = arquivos[selecionado].reduce(function(str, arquivos){
return str + '<option value="' + dias + '">' + dias + '</option>';
}, '');
})
});
This is the video tag that each of the Dia menu should return:
<video class="borda-player" src="' + arquivos + '" width="56%" controls></video>
And finally, this is the basis in html:
<select name="dias" id="mes" class="selecao">
<option value="Janeiro">Janeiro</option>
<option value="Fevereiro">Fevereiro</option>
<option value="Março">Março</option>
</select>
<select id="diaSelecionado" class="selecao"></select>
The end result should be like this:
Help me, please, help me!
Thanks a lot Victor! I’ll read about it and use your code as a base! Thanks a lot!!
– Thalles Oliveira