Question

In: Computer Science

<HTML JAVASCRIPT> Please create an array of student names and another array of student grades. Create...

<HTML JAVASCRIPT>

Please create an array of student names and another array of student grades.

Create a function that can put a name and a grade to the arrays.

Keep Read student name and grade until student name is “???”. And save the reading by using a function

Create another function to show all the grade in that object.

Create the third function that can display the maximum grade and the student’s name.

Create a sorting function that can sort the arrays based on the student’s grade.

Display all the grades and names sorted by the grade.

[Report]

PLEASE POST OUTPUT IN NOTEPAD++ or NOTEPAD! Thanks

Solutions

Expert Solution

<!DOCTYPE html>
<html>
<head>


</head>
<body>
<div>
    <input id="name" placeholder="name">
    <input id="grade" placeholder="grade">
    <button onclick="add()">Submit</button>

    <p id="students"></p>
    <p id="grades"></p>
    <p id="all_grades"></p>
    <p id="max_grade"></p>
    <p id="sorted_result"></p>
</div>
</body>

<script>
        const students = []
        const grades = []

        function add () {
            const student = document.getElementById("name").value
            if(student === "???"){
                showGrades()
                maxGrade()
                sort()
                return;
            }
            const grade = parseInt(document.getElementById("grade").value)
            students.push(student)
            grades.push(grade)
            showStudentGrades()

        }
        function saveDetails(name, grade) {
            students.push({name, grade});
            console.log(students)
        }

        function showGrades() {
            const allGrades = grades.join(", ")
            document.getElementById("all_grades").innerHTML ="All Grades : " + allGrades;
        }

        function maxGrade() {
           let maxIndex =  grades.indexOf(Math.max(...grades));
           console.log(maxIndex)
           let maxGradeStudent = students [maxIndex]

           document.getElementById("max_grade").innerHTML ="Max Grade : " + maxGradeStudent + " " + grades[maxIndex];
        }

        function sort() {
            const obj = [];
            for(let i = 0 ;i< students.length; i++) {
                obj.push({"name":students[i], "grade":grades[i]})
            }
            obj.sort((a,b) => (a.grade > b.grade) ? 1 : ((b.grade > a.grade) ? -1 : 0));

            const result = obj.map(x => x.name + " " + x.grade).join("<br />")
            document.getElementById("sorted_result").innerHTML = "Sorted Result : <br />"+result;
        }

        function showStudentGrades () {
            document.getElementById("students").innerHTML = "Students : "+students.join(" ");
            document.getElementById("grades").innerHTML = "Grades : "+grades.join(" ");
        }



</script>
</html>

venereology answered 2 days ago
Next > < Previous

Related Solutions

JAVASCRIPT: Please create an array of student names and another array of student grades. - Create...
JAVASCRIPT: Please create an array of student names and another array of student grades. - Create a function that can put a name and a grade to the arrays. - Keep Read student name and grade until student name is “???”. And save the reading by using a function - Create another function to show all the grade in that object. - Create the third function that can display the maximum grade and the student’s name. - Create a sorting...
JAVASCRIPT: - Please create an object (grade) with 10 names and 10 grades. - Create a...
JAVASCRIPT: - Please create an object (grade) with 10 names and 10 grades. - Create a method (inputGrade) that can put a name and a grade to the grade object. - Create another method (showAlltheGrades) to show all the grade in that object. - Create the third method (MaxGrade) that can display the maximum grade and the student name. - Using “prompt” and inputGrade method input 10 student names and their grades. - Display all the grades and names by...
JAVASCRIPT: - Please create an object (grade) with 10 names and 10 grades. - Create a...
JAVASCRIPT: - Please create an object (grade) with 10 names and 10 grades. - Create a method (inputGrade) that can put a name and a grade to the grade object. - Create another method (showAlltheGrades) to show all the grade in that object. - Create the third method (MaxGrade) that can display the maximum grade and the student name. - Using “prompt” and inputGrade method input 10 student names and their grades. - Display all the grades and names by...
JAVASCRIPT: - Please create an object (grade) with 10 names and 10 grades. - Create a...
JAVASCRIPT: - Please create an object (grade) with 10 names and 10 grades. - Create a method (inputGrade) that can put a name and a grade to the grade object. - Create another method (showAlltheGrades) to show all the grade in that object. - Create the third method (MaxGrade) that can display the maximum grade and the student name. - Using “prompt” and inputGrade method input 10 student names and their grades. - Display all the grades and names by...
The code to create a Search/Filter Data with Javascript or html from html page.
The code to create a Search/Filter Data with Javascript or html from html page.
Please Use JavaScript and HTML 5) Number guesser (easier) Create a number guessing name, using an...
Please Use JavaScript and HTML 5) Number guesser (easier) Create a number guessing name, using an input and a button to gather a number. The number to be guessed should be a hard-coded whole number between 1 and 20. Tell the user if the number is too high, equal to, or too low than a number you have hard-coded in your application. Remove the text in the input when the user clicks the button.
JavaScript - Create a class using "names" as the identifier. Create a constructor. The constructor must...
JavaScript - Create a class using "names" as the identifier. Create a constructor. The constructor must have elements as follow: first ( value passed will be String ) last ( value passed will be String ) age ( value passed will be Numeric ) The constructor will assign the values for the three elements and should use the "this" keyword Create a function, using "printObject" as the identifier printObject: This function will have three input parameters: allNames , sortType, message...
Create an array list (names) that will hold the names of several hall of fame soccer...
Create an array list (names) that will hold the names of several hall of fame soccer players. 2. Place your name on the screen as the master recorder:              “Master Hall of Fame Recorder: John Paul Jones” 3. Ask the user how many names they would like to record. (input 5 when the program runs) 4. Create a loop that will ask for the “Hall of fame member #1: “, etc Add in the following names: Pele Rooney Maradona Messi...
For this assignment you need to create a ToDo list using Javascript, along with HTML and...
For this assignment you need to create a ToDo list using Javascript, along with HTML and CSS. Begin by creating a HTML page called todo.html. Then create a Javascript file called todo.js and link it in to the HTML page using a script tag. All Javascript for the assignment must be in the separate file. (For CSS, feel free to include styles in a style block at the top of the HTML page, or to link in CSS from a...
For this assignment you need to create a ToDo list using Javascript, along with HTML and...
For this assignment you need to create a ToDo list using Javascript, along with HTML and CSS. Begin by creating a HTML page called todo.html. Then create a Javascript file called todo.js and link it in to the HTML page using a script tag. All Javascript for the assignment must be in the separate file. (For CSS, feel free to include styles in a style block at the top of the HTML page, or to link in CSS from a...
ADVERTISEMENT
Subjects
ADVERTISEMENT
Latest Questions
ADVERTISEMENT