-
Notifications
You must be signed in to change notification settings - Fork 0
/
workshop.html
103 lines (83 loc) · 2.83 KB
/
workshop.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
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
<!-- The core Firebase JS SDK is always required and must be listed first -->
<script src="https://www.gstatic.com/firebasejs/8.4.3/firebase.js"></script>
<!-- TODO: Add SDKs for Firebase products that you want to use
https://firebase.google.com/docs/web/setup#available-libraries
<script src="https://www.gstatic.com/firebasejs/8.4.3/firebase-analytics.js"></script>
-->
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script>
// Your web app's Firebase configuration
// For Firebase JS SDK v7.20.0 and later, measurementId is optional
var firebaseConfig = {
apiKey: "***",
authDomain: "***",,
projectId: "***",,
storageBucket: "***",,
messagingSenderId: "***",,
appId: "***",,
databaseURL: "***",
};
// Initialize Firebase
firebase.initializeApp(firebaseConfig);
//firebase.analytics();
function writeData() {
var gender = $("input[type='radio'][name='gender']:checked").val();
// var g= gender.value;
var e = document.getElementById("interest");
var strUser = e.value;
console.log(gender);
firebase.database().ref("User").push({
name:document.getElementById("namefield").value,
age:document.getElementById("agefield").value,
usn: document.getElementById("usn").value,
email:document.getElementById("email-id").value,
interest: strUser,
gender: gender
});
}
//var database = firebase.database();
function getData2() {
firebase.database().ref("User").once('value', function(snapshot){
var content = '';
snapshot.forEach(function(childSnapshot){
var val = childSnapshot.val();
content +='<tr>';
content += '<td>' + val.name + '</td>';
content += '<td>' + val.age + '</td>';
content += '<td>' + val.usn + '</td>';
content += '</tr>';
})
$('#table').append(content);
})
}
</script>
<h1>User database</h1>
<input type="text" placeholder="Name" id="namefield">
<input type="text" placeholder="Age" id="agefield">
<!--Select/dropdown-->
<select id="interest">
<option value="python">python</option>
<option value="java" selected="selected">java</option>
<option value="C">C</option>
</select>
<!-- RADIO-->
<label><input type="radio" name="gender" value="M"> M</label>
<label><input type="radio" name="gender" value="F" checked> F</label>
<input type="text" id="usn" placeholder="USN">
<input type="text" id="email-id" placeholder="email-id">
<button onclick="writeData()">Submit</button>
<button onclick="getData2()">Get Data</button>
<table style="width:100%" id="table">
<tr id="tr">
<th>Name:</th>
<th>Age:</th>
</table>
<p id="data"></p>
</body>
</html>