Click here to Skip to main content
15,867,704 members
Please Sign up or sign in to vote.
1.00/5 (1 vote)
See more:
i try to do this: Create a web page using HTML and JavaScript. On the website where your name will appear. · Fill in a table with Student Objects. · These objects have 3 fields (fullname, age, amka). The creation of these objects will be done using Constructor (Note the fullname field is the name and is given as follows: "First name - Last name" · The table that is filled until an object is given under the age of 18. ATTENTION this object does not will be inserted in the table.

i am lost i have try a lot but i don't know if i made it right

What I have tried:

first try:

<!DOCTYPE html>
<html lang="en">
    <script>



        function createPerson() {
                var fullname = document.getElementById('inputValueFullname').value;
                var age = document.getElementById('inputValueAge').value;
                var amka = document.getElementById('inputValueAmka').value;

        function person(fullname, age, amka) {
        this.fullname = fullname;
        this.age = age;
        this.amka = amka;
  }
  var NewPerson = new person(name, age, amka);

  console.log(NewPerson);
}
 </script>

 
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>

    <label>Fullname: <input type="text" id="inputValueFullname"></label>
    <label>Age:<input type="text" id="inputValueAge"></label>
    <label>Amka:<input type="text" id="inputValueAmka"></label>
    <button type="button" onclick="createPerson()();">Click Me</button>

    <table id="table">
        <thead>
            <tr>
                <th>Name/Surname</th>
                <th>Age</th>
                <th>AMKA</th><br><br><br><br><br>
            </tr>
        </thead>
    </table>
</body>
</html>


second try:

<!DOCTYPE html>
<html lang="en">

    <script>
        function publishToTable() {
            const fullname = document.getElementById('fullname').value;
            const age = document.getElementById('age').value;
            const amka = document.getElementById('amka').value;
            const error = document.getElementById('error');
           
            if (age && age>= 18 && fullname && amka) {
                const tableElement = document.getElementById('table');
                const trElement = document.createElement('tr');
                const tbodyElement = document.createElement('tbody');
                const fullnameEle = document.createElement('td');
                const ageEle = document.createElement('td');
                const amkaEle = document.createElement('td');
                fullnameEle.innerHTML = fullname;
                ageEle.innerHTML = age;
                amkaEle.innerHTML = amka;
                trElement.appendChild(fullnameEle);
                trElement.appendChild(ageEle);
                trElement.appendChild(amkaEle);
                tbodyElement.appendChild(trElement);
                tableElement.appendChild(tbodyElement);
            }
        }
    </script>

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title></title>
</head>
<body>


    <div class="complete">
        <div class="form">
            <label>Fullname: <input id="fullname" type="text"></label>
            <label>Age: <input id="age" type="text"></label>
            <label>AMKA: <input id="amka" type="text"></label>
            <span id="error"></span>
            <button onclick="publishToTable()">Submit</button>
        </div>
        <div id="tables">
            <table id="table">
                <thead>
                    <tr>
                        <th>Name/Surname</th>
                        <th>Age</th>
                        <th>AMKA</th><br><br><br><br><br>
                    </tr>
                </thead>
            </table>
        </div>
    </div>
</body>
</html>
Posted
Comments
Member 15627495 13-Jun-22 9:56am    
hello !

use some prompt box in a loop with your constructor...
https://www.w3schools.com/js/js_popup.asp

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900