I am building a sample project named: Tennis Club Management using javascript, HTML, CSS, bootstrap. In this i have a Login Page (index.html) and Manage Players Page (managePlayers.html). In managePlayers.html, I have two buttons namely Add Player and Show Players. On click events of the two buttons, I need to show the tables.
Add Players click will show the table created in HTML and Show Players click will show table created in javascript as it will dynamically display table data based on the data fetched from API.
The Problem I am facing is when I click Show Player button the table gets displayed, and after that when I click Add Player button, the table does not show up.
Below are the code files and screenshots:
index.html
JavaScript
x
133
133
1
// --------------TESTING CODE FOR LOGIN PAGE LOGIN BUTTON CLICK----------------2
3
var istableCreated = false;4
var email, password,IDvalue=0;5
document.querySelector(".loginbtn").addEventListener("click", (e) => {6
email = document.querySelector(".email").value;7
password = document.querySelector(".password").value;8
9
document.querySelector(".labelemailerror").innerHTML = "";10
document.querySelector(".labelpassworderror").innerHTML = "";11
12
// ------------TESTING CODE FOR CHECKING VALIDATION AND PRINTING ERROR ON LABELS IF ANY-------------13
14
if (email === "admin@wimbledon.com" && password === "rogerfederer") {15
console.log("Login successfull....");16
window.open("profile.html");17
}18
else if (email === "" && password === "") {19
20
document.querySelector(".labelpassworderror").innerHTML = "Email and Password cannot be blank"21
}22
else if (email === "") {23
24
document.querySelector(".labelemailerror").innerHTML = "Email cannot be blank";25
}26
else if (password === "") {27
28
document.querySelector(".labelpassworderror").innerHTML = "Password cannot be blank"29
}30
else {31
32
document.querySelector(".labelpassworderror").innerHTML = "Invalid Email or Password";33
}34
35
console.log(email, password);36
e.preventDefault();37
});38
39
40
41
42
43
//------------------------------------MANAGE PLAYERS PAGE----------------------------------44
45
//--------------------------------TESTING CODE FOR SHOWING PLAYERS OF MANAGE PLAYERS PAGE--------------------------46
function showplayers() {47
document.querySelector(".customerregistration").innerHTML="";48
49
if (istableCreated == false) {50
51
52
istableCreated = true;53
console.log(istableCreated);54
55
//----------TESTING CODE FOR CREATING WRAPPER FOR BOOTSTRAP TABLE FOR RESPONSIVENESS--------56
57
var myDiv = document.createElement("div");58
myDiv.className = "table-responsive";59
myDiv.id = "table-responsive";60
myDiv.style.display="inline-block";61
document.body.appendChild(myDiv);62
63
//-----------TESTING CODE FOR CREATING BOOTSTRAP DYNAMIC TABLE USING JAVASCRIPT-------------64
65
var myTable = document.createElement("table");66
myTable.style.marginTop = "2%";67
myTable.className = "table";68
myTable.id = "table";69
document.body.appendChild(myDiv).appendChild(myTable);70
71
72
var myThead = document.createElement("thead");73
document.body.appendChild(myDiv).appendChild(myTable).appendChild(myThead);74
75
var myTr = document.createElement("tr");76
document.body.appendChild(myDiv).appendChild(myTable).appendChild(myThead).appendChild(myTr);77
78
var myThID = document.createElement("th");79
myThID.scope = "col";80
myThID.innerHTML = "ID";81
document.body.appendChild(myDiv).appendChild(myTable).appendChild(myThead).appendChild(myTr).appendChild(myThID);82
83
var myThName = document.createElement("th");84
myThName.scope = "col";85
myThName.innerHTML = "Name";86
document.body.appendChild(myDiv).appendChild(myTable).appendChild(myThead).appendChild(myTr).appendChild(myThName);87
88
var myThGender = document.createElement("th");89
90
myThGender.scope = "col";91
myThGender.innerHTML = "Gender";92
document.body.appendChild(myDiv).appendChild(myTable).appendChild(myThead).appendChild(myTr).appendChild(myThGender);93
94
var mySubscription = document.createElement("th");95
mySubscription.scope = "col";96
mySubscription.innerHTML = "Subscription";97
document.body.appendChild(myDiv).appendChild(myTable).appendChild(myThead).appendChild(myTr).appendChild(mySubscription);98
99
var myfeeStatus = document.createElement("th");100
myfeeStatus.scope = "col";101
myfeeStatus.innerHTML = "Fee Status";102
document.body.appendChild(myDiv).appendChild(myTable).appendChild(myThead).appendChild(myTr).appendChild(myfeeStatus);103
104
}105
else {106
console.log(istableCreated);107
}108
}109
110
111
112
//---------------------TESTING CODE FOR DISPLAYING TABLE FOR ADDING CUSTOMER INFORMATION--------------- 113
114
115
function addplayers() {116
console.log("add players clicked.....");117
document.querySelector(".customerregistration").style.display = "block";118
IDvalue+=1;119
// document.querySelector(".ID").value=IDvalue;120
121
}122
123
124
125
//--------------------------TESTING CODE FOR SAVING CUSTOMER INFORMATION OF MANAGE PLAYERS PAGE-----------------------------126
127
128
129
function save() {130
console.log("data saved successfully...");131
return false;132
}133
managePlayers.html
JavaScript
1
151
151
1
<!DOCTYPE html>2
<html lang="en">3
4
<head>5
<meta charset="UTF-8">6
<meta name="viewport" content="width=device-width, initial-scale=1.0">7
<title>Manage Players</title>8
9
<!-- ADDING FONT AWESOME CSS -->10
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">11
12
<!-- ADDING BOOTSTRAP CSS -->13
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css"14
integrity="sha384-9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc+NcPb1dKGj7Sk" crossorigin="anonymous">15
16
<!-- ADDING STYLE.CSS -->17
<link rel="stylesheet" href="/css/style.css">18
19
</head>20
21
<body class="managePlayers">22
23
<!-- ADDING BUTTONS LIKE SHOW PLAYERS, ADD PLAYERS USING CSS BOOTSTRAP -->24
<button type="button" class="btn btn-secondary showplayers" onclick="showplayers();">Show Players</button>25
<button type="button" class="btn btn-secondary addplayers" onclick="addplayers()">Add Players</button>26
27
<!-- CREATING REGISTRATION FORM OF CUSTOMER -->28
<table class="customerregistration">29
<tr>30
<td>31
<Label>ID :</Label>32
</td>33
<td>34
<input type="text" class ="ID" readonly>35
</td>36
</tr>37
<tr>38
<td>39
<label>DOB :</label>40
</td>41
<td>42
<input type="date" id="birthday" name="birthday">43
</td>44
</tr>45
<tr>46
<td>47
<label>NAME :</label>48
</td>49
<td>50
<input type="text" class="name" id="name">51
</td>52
</tr>53
54
<tr>55
<td>56
<label>GENDER :</label>57
</td>58
<td>59
<input type="radio" name="gender" value="female"> Female60
<input type="radio" name="gender" value="male"> Male61
</td>62
63
</tr>64
65
<tr>66
<td>67
<label>CONTACT :</label>68
</td>69
<td>70
<input type="text" class="customercontact" id="customercontact">71
</td>72
</tr>73
74
<tr>75
<td>76
<label>ADDRESS :</label>77
</td>78
<td>79
<textarea class="address" id="address" cols="20" rows="3"></textarea>80
</td>81
</tr>82
83
<tr>84
<td>85
<label>ID PROOF :</label>86
<select class="idproof" id="idproof">87
<option value="select">---Select---</option>88
<option value="license">License</option>89
<option value="aadhaar">Aadhaar</option>90
<option value="passport">Passport</option>91
</select>92
</td>93
<td>94
<input type="text" class="idprooftextbox">95
</td>96
</tr>97
98
<tr>99
<td>100
<label>MEMBERSHIP FOR :</label>101
</td>102
<td>103
<select class="membershipfor" id="membershipfor">104
<option value="select">---Select---</option>105
<option value="court">COURT</option>106
<option value="tournament">TOURNAMENT</option>107
<option value="both">BOTH</option>108
</select>109
</td>110
</tr>111
112
<tr>113
<td>114
<label>MEMBERSHIP TYPE :</label>115
</td>116
<td>117
<select class="membershiptype" id="membershiptype">118
<option value="select">---Select---</option>119
<option value="monthly">MONTHLY</option>120
<option value="halfyearly">HALF YEARLY</option>121
<option value="annually">ANNUALLY</option>122
</select>123
</td>124
</tr>125
<tr>126
<td>127
<button type="button" class="btn btn-success save">SAVE</button>128
</td>129
</tr>130
</table>131
132
<!-- ADDING BOOTSTRAP JS -->133
<!-- JS, Popper.js, and jQuery -->134
<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js"135
integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj"136
crossorigin="anonymous"></script>137
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js"138
integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo"139
crossorigin="anonymous"></script>140
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js"141
integrity="sha384-OgVRvuATP1z7JjHLkuOU7Xw704+h835Lr+6QL9UvYjZE3Ipu6Tp75j7Bh/kR0JKI"142
crossorigin="anonymous"></script>143
144
<!-- ADDING INDEX.JS -->145
<script src="/js/sidebar.js"></script>146
<script src="/js/index.js"></script>147
148
</body>149
150
</html>151
Screenshots
Nothin happens when I click on Add players
Any Solution please ?
https://jsfiddle.net/mohitsharma1991/s2ncwqvL/1/
Advertisement
Answer
You need to use the tbody with id selector and hide add Player section if the show players is clicked or vise versa when the show players is clicked you need to set the add players to display:none
The reason it was not working with your existing code was that you were using innerHTML and clearing it out completely from the DOM when you click showplayers().
Once you were clicking it back again the DOM is cleared with add player section and does not exist anymore.
Live Demo:
JavaScript
1
125
125
1
// --------------TESTING CODE FOR LOGIN PAGE LOGIN BUTTON CLICK----------------2
3
var istableCreated = false;4
var email, password, IDvalue = 0;5
/* document.querySelector(".loginbtn").addEventListener("click", (e) => {6
email = document.querySelector(".email").value;7
password = document.querySelector(".password").value;8
9
document.querySelector(".labelemailerror").innerHTML = "";10
document.querySelector(".labelpassworderror").innerHTML = "";11
12
// ------------TESTING CODE FOR CHECKING VALIDATION AND PRINTING ERROR ON LABELS IF ANY-------------13
14
if (email === "admin@wimbledon.com" && password === "rogerfederer") {15
console.log("Login successfull....");16
window.open("profile.html");17
} else if (email === "" && password === "") {18
19
document.querySelector(".labelpassworderror").innerHTML = "Email and Password cannot be blank"20
} else if (email === "") {21
22
document.querySelector(".labelemailerror").innerHTML = "Email cannot be blank";23
} else if (password === "") {24
25
document.querySelector(".labelpassworderror").innerHTML = "Password cannot be blank"26
} else {27
28
document.querySelector(".labelpassworderror").innerHTML = "Invalid Email or Password";29
}30
31
console.log(email, password);32
e.preventDefault();33
});34
*/35
36
37
//------------------------------------MANAGE PLAYERS PAGE----------------------------------38
39
//--------------------------------TESTING CODE FOR SHOWING PLAYERS OF MANAGE PLAYERS PAGE--------------------------40
function showplayers() {41
// document.querySelector(".customerregistration").innerHTML = "";42
document.querySelector("#add_player").style.display = "none";43
44
if (istableCreated == false) {45
istableCreated = true;46
47
//----------TESTING CODE FOR CREATING WRAPPER FOR BOOTSTRAP TABLE FOR RESPONSIVENESS--------48
49
var myDiv = document.createElement("div");50
myDiv.className = "table-responsive";51
myDiv.id = "table-responsive";52
myDiv.style.display = "inline-block";53
document.body.appendChild(myDiv);54
55
//-----------TESTING CODE FOR CREATING BOOTSTRAP DYNAMIC TABLE USING JAVASCRIPT-------------56
57
var myTable = document.createElement("table");58
myTable.style.marginTop = "2%";59
myTable.className = "table";60
myTable.id = "table";61
document.body.appendChild(myDiv).appendChild(myTable);62
63
64
var myThead = document.createElement("thead");65
document.body.appendChild(myDiv).appendChild(myTable).appendChild(myThead);66
67
var myTr = document.createElement("tr");68
document.body.appendChild(myDiv).appendChild(myTable).appendChild(myThead).appendChild(myTr);69
70
var myThID = document.createElement("th");71
myThID.scope = "col";72
myThID.innerHTML = "ID";73
document.body.appendChild(myDiv).appendChild(myTable).appendChild(myThead).appendChild(myTr).appendChild(myThID);74
75
var myThName = document.createElement("th");76
myThName.scope = "col";77
myThName.innerHTML = "Name";78
document.body.appendChild(myDiv).appendChild(myTable).appendChild(myThead).appendChild(myTr).appendChild(myThName);79
80
var myThGender = document.createElement("th");81
82
myThGender.scope = "col";83
myThGender.innerHTML = "Gender";84
document.body.appendChild(myDiv).appendChild(myTable).appendChild(myThead).appendChild(myTr).appendChild(myThGender);85
86
var mySubscription = document.createElement("th");87
mySubscription.scope = "col";88
mySubscription.innerHTML = "Subscription";89
document.body.appendChild(myDiv).appendChild(myTable).appendChild(myThead).appendChild(myTr).appendChild(mySubscription);90
91
var myfeeStatus = document.createElement("th");92
myfeeStatus.scope = "col";93
myfeeStatus.innerHTML = "Fee Status";94
document.body.appendChild(myDiv).appendChild(myTable).appendChild(myThead).appendChild(myTr).appendChild(myfeeStatus);95
96
} else {97
document.querySelector("#table-responsive").style.display = "block";98
}99
}100
101
102
103
//---------------------TESTING CODE FOR DISPLAYING TABLE FOR ADDING CUSTOMER INFORMATION--------------- 104
105
106
function addplayers() {107
document.querySelector("#add_player").style.display = "block";108
if (istableCreated) {109
document.querySelector("#table-responsive").style.display = "none";110
}111
112
IDvalue += 1;113
// document.querySelector(".ID").value=IDvalue;114
}115
116
117
118
//--------------------------TESTING CODE FOR SAVING CUSTOMER INFORMATION OF MANAGE PLAYERS PAGE-----------------------------119
120
121
122
function save() {123
console.log("data saved successfully...");124
return false;125
}JavaScript
1
265
265
1
form {2
margin: auto;3
/* nice thing of auto margin if display:flex; it center both horizontal and vertical :) */4
width: 30%;5
}6
7
img {8
display: block;9
margin-left: auto;10
margin-right: auto;11
width: 25%;12
height: 25%;13
margin-top: 3%;14
margin-bottom: 1.5%;15
}16
17
.login {18
display: table-cell;19
text-align: center;20
vertical-align: middle;21
}22
23
label {24
font-weight: bolder;25
}26
27
.labelemailpassworderror {28
color: red;29
font-size: 10px;30
text-align: left;31
}32
33
.labelemailerror {34
color: red;35
font-size: 10px;36
text-align: center;37
}38
39
.labelpassworderror {40
color: red;41
font-size: 10px;42
text-align: center;43
}44
45
h3 {46
text-align: center;47
}48
49
h5 {50
text-align: center;51
color: green;52
}53
54
.forgotpassword {55
text-align: center;56
font-size: 10px;57
/* margin-left: 25%; */58
}59
60
.signup {61
text-align: center;62
font-size: 10px;63
}64
65
span {66
color: #1a73e8;67
}68
69
span:hover {70
color: purple;71
}72
73
74
/* ---------------- SETTING CSS PROPERTIES OF PROFILE PAGE---------------- */75
76
body {77
margin-top: 0;78
font-family: "Lato", sans-serif;79
}80
81
.sidebar {82
top: 0;83
left: 0;84
margin: 0;85
padding: 0;86
width: 200px;87
background-color: #f1f1f1;88
position: fixed;89
height: 100%;90
overflow: auto;91
}92
93
.sidebar a {94
display: block;95
color: black;96
padding: 16px;97
text-decoration: none;98
}99
100
.sidebar a.active {101
background-color: #4CAF50;102
color: white;103
}104
105
.sidebar a:hover:not(.active) {106
background-color: #555;107
color: white;108
}109
110
div.content {111
margin-left: 200px;112
padding: 1px 16px;113
height: 1000px;114
}115
116
@media screen and (max-width: 700px) {117
.sidebar {118
width: 100%;119
height: auto;120
position: relative;121
}122
123
.sidebar a {124
float: left;125
}126
127
div.content {128
margin-left: 0;129
}130
}131
132
@media screen and (max-width: 400px) {133
.sidebar a {134
text-align: center;135
float: none;136
}137
}138
139
.editadminprofile {140
float: right;141
}142
143
144
/* ---------------- SETTING CSS PROPERTIES OF MANAGE PLAYERS PAGE---------------- */145
146
.showplayers {147
margin-right: 30%;148
margin-top: 5%;149
margin-bottom: 2%;150
float: right;151
width: 15%;152
}153
154
.addplayers {155
margin-right: 3%;156
margin-top: 5%;157
margin-bottom: 2%;158
float: right;159
width: 15%;160
}161
162
163
/* ---------------- SETTING CSS PROPERTIES OF MANAGE TRAINERS PAGE---------------- */164
165
.showtrainers {166
margin-right: 30%;167
margin-top: 5%;168
float: right;169
width: 15%;170
}171
172
.addtrainers {173
margin-right: 3%;174
margin-top: 5%;175
float: right;176
width: 15%;177
}178
179
180
/* ---------------- SETTING CSS PROPERTIES OF MANAGE TOURNAMENTS PAGE---------------- */181
182
.showtournaments {183
margin-right: 30%;184
margin-top: 5%;185
float: right;186
width: 15%;187
}188
189
.addtournaments {190
margin-right: 3%;191
margin-top: 5%;192
float: right;193
width: 15%;194
}195
196
197
/* ---------------- SETTING CSS PROPERTIES OF MANAGE MATCHES PAGE---------------- */198
199
.showmatches {200
margin-right: 30%;201
margin-top: 5%;202
float: right;203
width: 15%;204
}205
206
.addmatches {207
margin-right: 3%;208
margin-top: 5%;209
float: right;210
width: 15%;211
}212
213
214
/* ---------------- SETTING CSS PROPERTIES OF MANAGE FEES PAGE---------------- */215
216
.showfees {217
margin-right: 30%;218
margin-top: 5%;219
float: right;220
width: 15%;221
}222
223
.addfees {224
margin-right: 3%;225
margin-top: 5%;226
float: right;227
width: 15%;228
}229
230
231
/* ---------------- SETTING CSS PROPERTIES OF TABLE OF MANAGE PLAYER PAGE ---------------- */232
233
table {234
table-layout: fixed;235
}236
237
table th,238
table td {239
overflow: hidden;240
}241
242
th {243
width: 5%;244
}245
246
247
/*-------------- SETING CSS PROPERTIES OF CUSTOMER REGISTRATION FORM-------------*/248
249
.customerregistration {250
margin-top: 5%;251
float: right;252
margin-right: 32%;253
}254
255
#add_player {256
display: none;257
}258
259
td {260
padding: 1.4%;261
}262
263
.address {264
resize: none;265
}JavaScript
1
141
141
1
<!DOCTYPE html>2
<html lang="en">3
4
<head>5
<meta charset="UTF-8">6
<meta name="viewport" content="width=device-width, initial-scale=1.0">7
<title>Manage Players</title>8
9
<!-- ADDING FONT AWESOME CSS -->10
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">11
12
<!-- ADDING BOOTSTRAP CSS -->13
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css" integrity="sha384-9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc+NcPb1dKGj7Sk" crossorigin="anonymous">14
15
<!-- ADDING STYLE.CSS -->16
<link rel="stylesheet" href="/css/style.css">17
18
</head>19
20
<body class="managePlayers">21
22
<!-- ADDING BUTTONS LIKE SHOW PLAYERS, ADD PLAYERS USING CSS BOOTSTRAP -->23
<button type="button" class="btn btn-secondary showplayers" onclick="showplayers();">Show Players</button>24
<button type="button" class="btn btn-secondary addplayers" onclick="addplayers()">Add Players</button>25
26
<!-- CREATING REGISTRATION FORM OF CUSTOMER -->27
<table class="customerregistration">28
<tbody id="add_player">29
<tr>30
<td>31
<Label>ID :</Label>32
</td>33
<td>34
<input type="text" class="ID" readonly>35
</td>36
</tr>37
<tr>38
<td>39
<label>DOB :</label>40
</td>41
<td>42
<input type="date" id="birthday" name="birthday">43
</td>44
</tr>45
<tr>46
<td>47
<label>NAME :</label>48
</td>49
<td>50
<input type="text" class="name" id="name">51
</td>52
</tr>53
54
<tr>55
<td>56
<label>GENDER :</label>57
</td>58
<td>59
<input type="radio" name="gender" value="female"> Female60
<input type="radio" name="gender" value="male"> Male61
</td>62
63
</tr>64
65
<tr>66
<td>67
<label>CONTACT :</label>68
</td>69
<td>70
<input type="text" class="customercontact" id="customercontact">71
</td>72
</tr>73
74
<tr>75
<td>76
<label>ADDRESS :</label>77
</td>78
<td>79
<textarea class="address" id="address" cols="20" rows="3"></textarea>80
</td>81
</tr>82
83
<tr>84
<td>85
<label>ID PROOF :</label>86
<select class="idproof" id="idproof">87
<option value="select">---Select---</option>88
<option value="license">License</option>89
<option value="aadhaar">Aadhaar</option>90
<option value="passport">Passport</option>91
</select>92
</td>93
<td>94
<input type="text" class="idprooftextbox">95
</td>96
</tr>97
98
<tr>99
<td>100
<label>MEMBERSHIP FOR :</label>101
</td>102
<td>103
<select class="membershipfor" id="membershipfor">104
<option value="select">---Select---</option>105
<option value="court">COURT</option>106
<option value="tournament">TOURNAMENT</option>107
<option value="both">BOTH</option>108
</select>109
</td>110
</tr>111
112
<tr>113
<td>114
<label>MEMBERSHIP TYPE :</label>115
</td>116
<td>117
<select class="membershiptype" id="membershiptype">118
<option value="select">---Select---</option>119
<option value="monthly">MONTHLY</option>120
<option value="halfyearly">HALF YEARLY</option>121
<option value="annually">ANNUALLY</option>122
</select>123
</td>124
</tr>125
<tr>126
<td>127
<button type="button" class="btn btn-success save">SAVE</button>128
</td>129
</tr>130
</tbody>131
</table>132
133
<!-- ADDING BOOTSTRAP JS -->134
<!-- JS, Popper.js, and jQuery -->135
<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>136
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js" integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo" crossorigin="anonymous"></script>137
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js" integrity="sha384-OgVRvuATP1z7JjHLkuOU7Xw704+h835Lr+6QL9UvYjZE3Ipu6Tp75j7Bh/kR0JKI" crossorigin="anonymous"></script>138
139
</body>140
141
</html>