Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript JavaScript Loops, Arrays and Objects Tracking Data Using Objects The Student Record Search Challenge Solution

Posted by baloch baloch
baloch baloch
235 Points

when i search for student's name the search bar disappears

var message = ''; var student; var search;

function print(message) { var outputDiv = document.getElementById('output'); outputDiv.innerHTML = message; }

function getStudentReport( student ) { var report = '<h2>Student: ' + student.name + '</h2>'; report += '<p>Track: ' + student.track + '</p>'; report += '<p>Points: ' + student.points + '</p>'; report += '<p>Achievements: ' + student.achievements + '</p>'; return report; }

while (true) { search = prompt('search students records: type a name or type quit to exit') if (search === null || search.toLowerCase() === 'quit') { break; }

for (var i = 0; i < students.length; i += 1) { student = students[i]; if (student.name === search) { message = getStudentReport( student ); print(message); }

} }

Anas AlHariri
Anas AlHariri
8,776 Points
Anas AlHariri
Anas AlHariri
8,776 Points

Try my solution:

Enjoy it ;)

//(Challenge) of Build Students' records using Array of Object.
var students = [
    {
        name: "Maxim",
        track: ["JavaScript", "CSS", "HTML"],
        achievements: 2379,
        points: 5323,
    },
    {
        name: "Gabriel",
        track: ["JavaScript"],
        achievements: 4192,
        points: 7210,
    },
    {
        name: "Wael",
        track: ["Basics"],
        achievements: 4261,
        points: 9   185,
    },
    {
        name: "Nora",
        track: ["Designing"],
        achievements: 517,
        points: 5300,
    },
    {
        name: "Katrina",
        track: ["Playing"],
        achievements: 397,
        points: 3212,
    },
    {
        name: "Maria",
        track: ["Nursing"],
        achievements: 190,
        points: 1800,
    },
    {
        name: "Gabriel",
        track: ["JavaScript"],
        achievements: 16000,
        points: 105210,
    },

];

//printOut: is a function the prints a message to a specific place that has the ID of "output" in the HTML file.
function printOut (message){
    document.getElementById("output").innerHTML = message;
}

//The Search for a student name in the array of objects "student".
//First, we need the searching prompt to keep reappearing to ask for a name to search. So we will use a Do-While Loop. we could use While Loop too.
do {
    //Asking for the name of the student. And if the user typed exit, quit or 0 we should "Break" the loop using break statement.
    var search = prompt("Please enter a name of a student, or type quit to exit.");

    //This variable to save the boolean result of the student. If the student is exist it will be true, and if the student isn't exist it will be false. Upon the result there will be a decision taken by the "if()" statement later to whether print or not the message that tells " The student ???? wasn't found!".
    var studentIsExist = false;

    //Testing the input of the user to check whether he wants to EXIT or Search.
    if (search == null || search.toLowerCase() == "exit" || search.toLowerCase() == "quit" || search == "0") {
        break; //If the user typed one of the exit words then the prompt will stop asking for a student name using the break statement.
    } else { //If the user didn't type Exit, Quit or 0 then search for the student.
        for (var i = 0; i < students.length; i++) {
            if (students[i].name.toLowerCase() == search) { //if the student name matches one or more of the names registered in the records then it will start the printing out process next.
                for (var key in students[i]) {
                    printOut("<span style='color:red;font-weight:bold;'>" + key.toUpperCase() + "</span> : <span style='color:gray'>" + students[i][key] + "</span><br>");
                }
                printOut("<br>");
                //Here the "studentIsExist" variable telling the conditional statement - that checks if the student isn't exist to print out the message - whether to print or not print the message of "student ??? wasn't found!".
                studentIsExist = true;
            }
        }
        //If the student is existed "TRUE" then nothing will happen, Else the message "Student ????? wasn't found!" will be printed out.
        if (!studentIsExist) {
            alert(search.toUpperCase() + " wasn't found!");
            printOut("<span style='color:magenta'>Student " + search.toUpperCase() + " wasn't found!</span><br><br>");
        }
    }
} while (true)

1 Answer

Steven Parker
Steven Parker
231,007 Points
Steven Parker
Steven Parker
231,007 Points

This program uses the prompt function, which creates a pop-up modal dialog box with an input field. Once the box is dismissed it goes away. This is the normal operation.

In later lessons you will learn how to use permanent fields on the page in your JavaScript programs.