-
Notifications
You must be signed in to change notification settings - Fork 0
/
main.js
62 lines (47 loc) · 1.57 KB
/
main.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
// Form
let form = document.querySelector('form');
//Containers
let mainContainer = document.getElementsByClassName('main-container');
let secondaryContainer = document.getElementsByClassName('secondary-container');
//Radio choices and the choice the user made
let radioChoices = document.querySelectorAll('input[type="radio"]');
let radioChoice;
//User answer
let userAnswer = document.getElementById('user-answer');
//Part of what we're working on at the bottom of this page 🥊
let submitButton = document.getElementsByClassName('submit-button')[0];
console.log(radioChoices);
hideSecondaryContainer();
//Runs when the form is submitted
form.onsubmit = function(e){
e.preventDefault();
radioChoice = document.querySelector('input[type="radio"]:checked');
changeNumber();
hideMainContainer();
showSecondaryContainer();
submitButton.onclick = function(){
if (radioChoice.value === '' || radioChoice.value === null){
window.alert('Please choose an option');
}
}
}
//Change the number in the secondary container
function changeNumber (){
userAnswer.innerHTML = radioChoice.value;
}
//Hide the main container
function hideMainContainer(){
mainContainer[0].style.display = 'none';
}
//Show the main container
function showMainContainer(){
mainContainer[0].style.display = 'block';
}
//Hide the secondary container
function hideSecondaryContainer(){
secondaryContainer[0].style.display = 'none';
}
//Show the secondary container
function showSecondaryContainer(){
secondaryContainer[0].style.display = 'block';
}