-
Notifications
You must be signed in to change notification settings - Fork 0
/
arrayOfObjects.html
118 lines (108 loc) · 4.54 KB
/
arrayOfObjects.html
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
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<script>
var students = [ {name:"A",rollno:"19BD1A055M",mobileNo:9876543210,email:"[email protected]"},
{name:"B",rollno:"20BD1A055M",mobileNo:9876543210,email:"[email protected]"},
{name:"C",rollno:"21BD1A055M",mobileNo:9876543210,email:"[email protected]"},
{name:"D",rollno:"22BD1A055M",mobileNo:9876543210,email:"[email protected]"},
{name:"E",rollno:"23BD1A055M",mobileNo:9876543210,email:"[email protected]"},
{name:"F",rollno:"24BD1A055M",mobileNo:9876543210,email:"[email protected]"},
{name:"G",rollno:"25BD1A055M",mobileNo:9876543210,email:"[email protected]"},
{name:"H",rollno:"26BD1A055M",mobileNo:9876543210,email:"[email protected]"},
{name:"I",rollno:"27BD1A055M",mobileNo:9876543210,email:"[email protected]"},
{name:"J",rollno:"28BD1A055M",mobileNo:9876543210,email:"[email protected]"}
];
var names = Object.keys(students[0]);
document.write("<table border = '1' >");
document.write("<tr>");
document.write("<th>");
document.write(names[0]);
document.write("</th>");
document.write("<th>");
document.write(names[1]);
document.write("</th>");
document.write("<th>");
document.write(names[2]);
document.write("</th>");
document.write("<th>");
document.write(names[3]);
document.write("</th>");
document.write("</tr>");
for (const i of students) {
document.write("<tr>");
for (const key in i) {
const element = i[key];
document.write("<td>");
document.write(element);
document.write("</td>");
}
document.write("</tr>");
}
document.write("</table>");
var val = 0;
function myfun(){
val+= 1;
var ele = document.getElementById("f").elements;
var c = {};
for (const i of ele) {
var a = i.id;
var b = i.value;
c[a] = b;
}
let head = Object.keys(c);
let data = Object.values(c);
var table = document.getElementsByTagName("table")[1];
if(val==1){
var tr = document.createElement("tr");
var th = document.createElement("th");
var node = document.createTextNode("S.NO");
th.appendChild(node);
tr.appendChild(th);
table.appendChild(tr);
for (const key of head) {
var th1 = document.createElement("th");
var node1 = document.createTextNode(key);
th1.appendChild(node1);
tr.appendChild(th1);
}
}
var tr1 = document.createElement("tr");
var td = document.createElement("td");
var node2 = document.createTextNode(val + ".");
td.appendChild(node2);
tr1.appendChild(td);
for (const i of data) {
var td1 = document.createElement("td");
var node3 = document.createTextNode(i);
td1.appendChild(node3);
tr1.appendChild(td1);
}
table.appendChild(tr1);
}
</script>
</head>
<body>
<br>
<form class="form-group" id="f" method="POST" onsubmit="return false;">
NAME : <input class="form-control" type="text" id="Name">
<br>
<br>
BRANCH : <input class="form-control" type="text" id="Branch">
<br>
<br>
EMAIL : <input class="form-control" type="email" id="Email">
<br>
<br>
</form>
<input class="form-control" type="submit" onclick="myfun()">
<br>
<br>
<br><br>
<table border="1">
</table>
</body>
</html>