pract/help at master · realicon23/pract · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
<!DOCTYPE html>
<html>
<head>
    <title></title>
    <style>
        table,th,tr,td{
            border:1px solid blue ;
        }
    </style>
</head>
<body>
</body>
<form action="form.html" >
  <div id="container">
    <h1>Register your details</h1>
    <p>Please fill in this form to create an account.</p>
    <hr>

    <label for="email"><b>Email</b></label>
    <input type="text" placeholder="Enter Email" name="email" required>

    <label for="Name"><b>Name</b></label>
    <input type="text" placeholder="Enter Name" name="Name" required>

    <label for="About" style= box-sizing:border-box><b>About</b></label>
    <input type="text" placeholder="Type here" name="About" required>


    <button type="submit"  onclick="showInput" value = "submit">Submit</button>
  </div>

</form>
<table class="myTable" style="width:100%">
        <thead>
            <tr>
                <th>Email</th>
                <th>name</th>
                <th>About</th>
        </thead>
        <tbody id="data-content">

        </tbody>
  </table>
  <button onclick="fillTable()" >Fill table</button>


    <script>
       const tableData= document.querySelector('#data-content');
      // let b=[3,3,3,3,3,];;

        let data = [
            {
                email:[],
                name:[],
                about:[]

            },
            {
                email:'',
                name:'',
                about:''
            },
            {
                email:'',
                name:'',
                about:''
            },
            {
                email:'',
                name:'',
                about:''
            },
            {
                email:'',
                name:'',
                about:''
            }
        ]

       function fillTable(){
        for(let i=0; i<data.length; i++){
            tableData.innerHTML+=`
            <tr>
                <td>${data[i].email}</td>
                <td>${data[i].name}</td>
                <td>${data[i].about}</td>
            <tr>

            `
        }
        function submit(){
            for(let i=name,email,about; i<data.length; i++){
                tableData.fillTable= submit
            }
        }
       }

    </script>


</html>