How do i get the value of an input and display it on the html document if name exist in an object property ?

Question

User enter a name in the text field and submit, js code should check if the name exist within an object, if name does then its displayed in html document else it must alert the users that the name doesnt exist
https://code.sololearn.com/WywlAnYZuSuR/?ref=app

Answer 1

Something like this, works.
Please cross-check the code especially line 16 in my code where I've added an extra thing called ".value".
That basically gets the value from the html input field.

[CODE]
const theBtn = document.getElementById('btn');
// a constructor function to create a new name if name doesnt exist
function Person(name, age, eyeColor ){
this.name = name;
this.age = age;
this.eyeColor = eyeColor;
}
// p1 is the test
const p1 = new Person('John', 44, 'blue');

function theSubmit(){
// collect the id's from document
let x = document.getElementById('userName').value;

if(x == p1.name){
console.log('the same')
} else {
console.log(' fail')
}
}