As the title suggests, when a user selects the letter 'B' in all the input fields, and clicks search it then will console.log('hello')
No eventually I want it to take them to anotehr page but I feel like that will come easy after I have this part down.
Help Me, Obi-Wan Kenobi. You're My Only Hope.
Here is what I have so far
HTML
<select id='inputOne'>
<option value="" selected disabled>Please select</option>
<option value="">A</option>
<option value="">B</option>
<option value="">C</option>
</select>
<select id='inputTwo'>
<option value="" selected disabled>Please select</option>
<option value="">A</option>
<option value="">B</option>
<option value="">C</option>
</select>
<select id='inputThree'>
<option value="" selected disabled>Please select</option>
<option value="">A</option>
<option value="">B</option>
<option value="">C</option>
</select>
<button type='button' onclick='myFunction()'>search</button>
JavaScript
//Assigned Variable to html elements
const inputOne = document.getElementById('inputOne');
const inputTwo = document.getElementById('inputTwo');
const inputThree = document.getElementById('inputThree');
//function to open a new page(or in this case say hekllo in the console)
function myFunction() {
if(inputOne == 'B' && inputTwo == 'B' && inputThree == 'B') {
console.log('hello')
} else {
console.log('error')
}
}
Please use below code:
//Assigned Variable to html elements
const inputOne = document.getElementById('inputOne');
const inputTwo = document.getElementById('inputTwo');
const inputThree = document.getElementById('inputThree');
//function to open a new page(or in this case say hekllo in the console)
function myFunction() {
if(inputOne.value == 'B' && inputTwo.value == 'B' && inputThree.value == 'B') {
console.log('hello')
} else {
console.log('error')
}
}
<select id='inputOne'>
<option value="" selected disabled>Please select</option>
<option value="A">A</option>
<option value="B">B</option>
<option value="C">C</option>
</select>
<select id='inputTwo'>
<option value="" selected disabled>Please select</option>
<option value="A">A</option>
<option value="B">B</option>
<option value="C">C</option>
</select>
<select id='inputThree'>
<option value="" selected disabled>Please select</option>
<option value="A">A</option>
<option value="B">B</option>
<option value="C">C</option>
</select>
<button type='button' onclick='myFunction()'>search</button>