.push onto an array which is in an object

Question

I am trying to .push() onto an array which is in an object. How can I do this?

I have an object called students{}. Each row of this contains a first name, last name, exam type and a subject for that exam type. I am trying to create an array (studentSubjectsByName) of all the subjects for this student for this exam type. Then I want to put that array of subjects into another object called nameSearch{}.

The info in the DB looks like this,

The Database table looks like this

> id    exam    subject             year    session     result  first   last
> 
> 186   A2  Further Mathematics 2015    January        D    Mark    Murphy
> 
> 185   A2  Pure Mathematics    2015    January        A    Mark    Murphy
> 
> 183   AP  Calculus            2015    NULL           2    Mark    Murphy
> 
> 184   AP  Chemistry           2015    NULL           5    David   Smith
> 
> 182   AP  Calculus            2015    NULL           5    David   Smith

(I can't post an image as I don't have 10 reps.)

As you can see Mark has two subjects in A2.

The following pushes subjects onto the array and results in the three subjects being elements in the arrays. There is an array for each subjects but each has three subjects. Instead of the AP array having two and the A2 array having just one as it should be. This is because the var studentSubjectsByName = []; is outside the for loop.

function checkStudent(){
    var subjectSearch = {};
    var nameSearch = {};
    var userInputFirst = document.getElementById('firstname').value;
    var userInputLast = document.getElementById('lastname').value;
    var students = <?php echo json_encode($studentNames, JSON_PRETTY_PRINT); ?>;
    var studentSubjectsByName = [];
    for(var i = 0; i < students.length; i++){

        console.log("userInputFirst: " + userInputFirst);
        if(userInputFirst == students[i].first && userInputLast == students[i].last){
            //console.log("First name: " + students[i].first + " Last name: " + students[i].last + " Exam: " + students[i].exam + " Subject: " + students[i].subject);

            nameSearch[students[i].exam] = {first:students[i].first, last:students[i].last, subjects:studentSubjectsByName};//this clears the array

            nameSearch[students[i].exam].subjects.push(students[i].subject);
            //console.log(studentSubjectsByName);
            //console.log(nameSearch);
       }
    }

    for(var item in nameSearch){
        var num = nameSearch[item].subjects.length;
        for(var i=0; i<num; i++){
            console.log("num: " + num + " nameSearch[" + item + "].subjects[" + i + "] is " + nameSearch[item].subjects[i]);
        }
    }
}

The output is

userInputFirst: M

userInputFirst: Ma

userInputFirst: Mar

userInputFirst: Mark

num: 3 nameSearch[A2].subjects[0] is Further Mathematics

num: 3 nameSearch[A2].subjects[1] is Pure Mathematics

num: 3 nameSearch[A2].subjects[2] is Calculus

num: 3 nameSearch[AP].subjects[0] is Further Mathematics

num: 3 nameSearch[AP].subjects[1] is Pure Mathematics

num: 3 nameSearch[AP].subjects[2] is Calculus

With var studentSubjectsByName = []; inside the for loop the array is constantly being cleared.

function checkStudent(){
    var subjectSearch = {};
    var nameSearch = {};
    var userInputFirst = document.getElementById('firstname').value;
    var userInputLast = document.getElementById('lastname').value;
    var students = <?php echo json_encode($studentNames, JSON_PRETTY_PRINT); ?>;

    for(var i = 0; i < students.length; i++){
         var studentSubjectsByName = [];
        console.log("userInputFirst: " + userInputFirst);
        if(userInputFirst == students[i].first && userInputLast == students[i].last){
            //console.log("First name: " + students[i].first + " Last name: " + students[i].last + " Exam: " + students[i].exam + " Subject: " + students[i].subject);

            nameSearch[students[i].exam] = {first:students[i].first, last:students[i].last, subjects:studentSubjectsByName};//this clears the array

            nameSearch[students[i].exam].subjects.push(students[i].subject);
            //console.log(studentSubjectsByName);
            //console.log(nameSearch);
       }
    }

    for(var item in nameSearch){
        var num = nameSearch[item].subjects.length;
        for(var i=0; i<num; i++){
            console.log("num: " + num + " nameSearch[" + item + "].subjects[" + i + "] is " + nameSearch[item].subjects[i]);
        }
    }
}

The output is.

userInputFirst: M

userInputFirst: Mar

userInputFirst: Mark

num: 1 nameSearch[A2].subjects[0] is Pure Mathematics

num: 1 nameSearch[AP].subjects[0] is Calculus

There should be two subjects in the AP array and one subject Calculus in the A2 array.

The HTML is,

<td class="left">
    First name: <input type="input" name="last" id="firstname" onkeyup="checkStudent()" placeholder="first name">
</td>
<td class="left">
    Last name: <input type="input" name="first" id="lastname" onkeyup="checkStudent()" placeholder="last name">
</td>

I can not figure this out. Any help would be appreciated. Thanks

Answer 1

Your question is not clear enough. I'm answering your title directly.

object.array.push(value);

Answer 2

Look at the updated code - i think you have a typo:

function checkStudent(){
    var nameSearch = {};
    var subjectSearch = {};
    var userInputFirst = document.getElementById('firstname').innerHTML;
    var userInputLast = document.getElementById('lastname').innerHTML;
    var students = [{ first: "first1", last: "last1", exam: "exam1", subject: "subject1"}, { first: "first2", last: "last2", exam: "exam2", subject: "subject2"}];
    for(var i = 0; i < students.length; i++){
        var studentSubjectsByName = [];
        if(userInputFirst == students[i].first && userInputLast == students[i].last){

            console.log("First name: " + students[i].first + " Last name: " + students[i].last + " Exam: " + students[i].exam + " Subject: " + students[i].subject);

            studentSubjectsByName.push(students[i].subject);  

            nameSearch[students[i].exam] = {first:students[i].first, last:students[i].last, subjects:studentSubjectsByName};

            nameSearch[students[i].exam].subjects.push(students[i].subject);
            console.log(studentSubjectsByName);
            console.log(nameSearch);
       }
    }
}

Here is the fiddle: https://jsfiddle.net/77er1a3r/

Answer 3

I can't get this to work using .innerHTML

var userInputFirst = document.getElementById('firstname').innerHTML;
var userInputLast = document.getElementById('lastname').innerHTML;
console.log("first: " + userInputFirst + " last: " + userInputLast);

But it does work, be it basically, with .value

var userInputFirst = document.getElementById('firstname').value;
var userInputLast = document.getElementById('lastname').value;
console.log("first: " + userInputFirst + " last: " + userInputLast);

The HTML is,

First name: Last name:

Is my use of .value instead of .innerHTML the type mentioned earlier? Thanks