Menu
<!DOCTYPE html>
<html>
<head>
<title>practice</title>
<meta charset="UTF-8">
<meta name="description" content="Creating and Maintaining Student Record Object">
<script>
var section = [];
var name = [];
var gender = [];
var age = [];
var favsub = [];
var studRec = [];
function saveButton() {
studRec[studRec.length] = {
section:document.getElementById("section").value,
name:document.getElementById("name").value,
gender:document.getElementById("gender").value,
age:document.getElementById("age").value,
favsub1:document.getElementsByClassName("favsub")[0].value,
favsub2:document.getElementsByClassName("favsub")[1].value,
favsub3:document.getElementsByClassName("favsub")[2].value,
}
document.getElementById("saveStud").reset();
console.log(studRec[studRec.length-1]);
}
function checker() {
var name = document.getElementById("name1").value;
var section = document.getElementById("section1").value;
var count=studRec.length;
var check;
for(var i=0;i<count;i++)
{
check = studRec[i].includes(name,section);
if( check == true){
return studRec[i];
}
alert("Info does not exist");
}
}
</script>
<form id="saveStud" method="POST">
<center>
<p>Section</p>
<select id="section" autofocus required>
<option value="0">select</option>
<option value="truth">truth</option>
<option value="faith">faith</option>
<option value="honesty">honesty</option>
<option value="charity">charity</option>
<option value="obedience">obedience</option>
<option value="chastity">chastity</option>
<option value="generosity">generosity</option>
<option value="humility">humility</option>
</select><br>
<p>Student Name</p><input id="name" type="text" required><br>
<p>Gender</p>
<select id="gender">
<option value="M">Male</option>
<option value="F">Female</option>
</select><br>
<p>Age</p><input id="age" type="number" required><br>
<p>Favorite Subjects</p><input class="favsub" type="text" required><br>
<input class="favsub" type="text" required><br>
<input class="favsub" type="text" required><br>
<button onclick="saveButton()">save</button>
<button type="reset" value="reset">reset</button>
</center>
</form>
<br>
<form id="search" method="POST">
<center>
<button type="button" onclick="checker()">search</button>
<input id="name1" type="text" placeholder="Enter Student Name" required>
<select id="section1" autofocus required>
<option value="0">select</option>
<option value="truth">truth</option>
<option value="faith">faith</option>
<option value="honesty">honesty</option>
<option value="charity">charity</option>
<option value="obedience">obedience</option>
<option value="chastity">chastity</option>
<option value="generosity">generosity</option>
<option value="humility">humility</option>
</select>
<br>
<button type="button">delete</button>
</center>
</form>
</body>
</html>
The code is suppose to store the student's information in an array using the function saveButton()then after that we type the student's name and select the section and using the search button, the function checker() is suppose to display the information if the the info inputted is included in the array studRec but the line check = studRec[i].includes(name,section); does not work. please help
496
asked Mar 13 '26 19:03
This is the object you are trying to call includes on:
{ section: document.getElementById("section").value, name: document.getElementById("name").value, gender: document.getElementById("gender").value, age: document.getElementById("age").value, favsub1: document.getElementsByClassName("favsub")[0].value, favsub2: document.getElementsByClassName("favsub")[1].value, favsub3: document.getElementsByClassName("favsub")[2].value, }
You haven't put an includes property there and objects don't have a native includes method. Arrays have one, but {} creates a plain object, not an array.
See How do I check if an object has a property in JavaScript? to test if an object has a property of a given name.
129
You have wrong understanding of how .includes works
Demo
[1, 3, 4].includes(3) // true
['apple', 'pie'].includes('american') // false
[{ name: 'John' }, { name: 'Obama' }].includes({ name: 'Obama' }) // true
Note what includes accepts as argument, its same data type as in array
Your mistake - checking wrong value signature
[{
section:document.getElementById("section").value,
name:document.getElementById("name").value,
gender:document.getElementById("gender").value,
age:document.getElementById("age").value,
favsub1:document.getElementsByClassName("favsub")[0].value,
favsub2:document.getElementsByClassName("favsub")[1].value,
favsub3:document.getElementsByClassName("favsub")[2].value,
}].includes(name, section) // false
Must be
[{
section:document.getElementById("section").value,
name:document.getElementById("name").value,
gender:document.getElementById("gender").value,
age:document.getElementById("age").value,
favsub1:document.getElementsByClassName("favsub")[0].value,
favsub2:document.getElementsByClassName("favsub")[1].value,
favsub3:document.getElementsByClassName("favsub")[2].value,
}, {
section:1,
name:1,
gender:1,
age:1,
favsub1:1,
favsub2:1,
favsub3:1,
}].includes({
section:1,
name:1,
gender:1,
age:1,
favsub1:1,
favsub2:1,
favsub3:1,
}) // true
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
