alexandrecoin
4/7/2018 - 11:46 AM

firebase_sdk_1.html

firebase_sdk_1.html
content_copyfile_download
<!DOCTYPE html>
<html lang="en">

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

<body>
  <ul id="list">    
  </ul>

  <form>
    <input type="text" name="firstname" id="submittedValue" value=""> 
    <br>
    <input type="submit" value="Submit" onclick="addNewName()">
  </form>

  <script src="https://www.gstatic.com/firebasejs/4.12.1/firebase.js"></script>
  <script src="script.js"></script>
</body>

</html>
script.js
content_copyfile_download
// Initialize Firebase
var config = {
  apiKey: "AIzaSyBMkJxiw00Mf4IW54d7SiHQym3DO6fCM1U",
  authDomain: "thewalkingdead-9fc71.firebaseapp.com",
  databaseURL: "https://thewalkingdead-9fc71.firebaseio.com",
  projectId: "thewalkingdead-9fc71",
  storageBucket: "thewalkingdead-9fc71.appspot.com",
  messagingSenderId: "224388998916"
};
firebase.initializeApp(config);
console.log(firebase);
let database = firebase.database();
var ref = database.ref('characters');


 function addNewName() {
    let nameValue = document.getElementById("submittedValue").value;
    let newName = {
        name: nameValue
        }
    ref.push(newName);
} 

ref.on('value', gotData, errData);

function gotData(data) {

    let names = data.val();
    let keys = Object.keys(names);
    for (let i = 0; i < keys.length; i = i + 1) {

        let name = names[keys[i]].name;
        let li = document.createElement('li', name);
        document.getElementById('list').appendChild(li);
        li.innerHTML = name;
    }

} 
 
function errData(err) {
    console.log(err.val());
    console.log('Error !');    
}