firebase เช็คชื่อ

✨ นายภานุพงศ์ เฉลยรัตน์

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    
<script src="https://www.gstatic.com/firebasejs/8.3.1/firebase-app.js"></script>
<script src="https://www.gstatic.com/firebasejs/8.3.1/firebase-firestore.js"></script>

<script>
    
  // Your web app's Firebase configuration
  var firebaseConfig = {
    apiKey: "AIzaSyAY2cCiS6dT2soQ4nz7I2qq-30ItLM_oB0",
    authDomain: "checkinkanait.firebaseapp.com",
    projectId: "checkinkanait",
    storageBucket: "checkinkanait.appspot.com",
    messagingSenderId: "934099740363",
    appId: "1:934099740363:web:78aa3111dc2c7a95181d4e"
  };
  // Initialize Firebase
  firebase.initializeApp(firebaseConfig);
  var wave = firebase.firestore();
</script>
<style>
    body{
        background: skyblue;
    }
    .see{
        height: 150px;
        width: 400px;
        margin: auto;
        text-align: center;
        background: palevioletred;
    }
  .showid{
    top:35%;
    left: 50%;
    transform: translate(-50%);
    position:absolute;
    padding: 20px;
    background:palevioletred;
        }
</style>
</head>
<body>
    <div class="see">
        <h1>
            STUDENT ID
        </h1>
        <input id="boom">
        <button onclick="add()">add</button>
    </div>
    <div class="showid">
        <h1 id="text_show">Show</h1>
        <button onclick="delete_all()" id="delete_all_btn">delete all</button>
        <div id="show"></div>
    </div>
    
</body>
<script>
        document.body.onkeyup = function(e){
            if(e.key == "Enter"){
                add()
                add_start_to_end()
            }
        }
        var html = "";
        function add_start_to_end(){
            let start_id = start.value;
            let end_id = end.value;
            start_id = parseInt(start_id);
            end_id = parseInt(end_id);
            for(let i=start_id; i<=end_id; i++){
                name.collection("collection")
                .doc(i.toString())
                .set({
                    id: i.toString(),
                    status: "not come"
                })
            }
            start.value = "";
            end.value = "";
        }
        function add(){
            name.collection("collection")
            .doc(college_id.value)
            .set({
                id: college_id.value,
                status: "not come"
            })
            college_id.value = "";
        }
        function delete_all(){
            name.collection("collection")
            .get()
            .then(function(snapshot){
                snapshot.forEach(function(docs){
                    name.collection("collection")
                    .doc(docs.data().id)
                    .delete()
                })
            })
        }
        name.collection("collection")
        .orderBy("id")
        .onSnapshot(function(snapshot) {
            snapshot.forEach(function(docs) {
                html += docs.id + " " + docs.data().status;
                html += `<button onclick="delete_id(this)" check="${docs.id}" id="btn_edit_del">del</button>`;
                html += `<button onclick="check_id(this)" check="${docs.id}" id="btn_edit_come">come</button>`;
                html += `<button onclick="check_id_not_come(this)" check="${docs.id}" id="btn_edit_not_come">not come</button>`;
                html += "<br></br>";
            })
            show.innerHTML = html;
            html = "";
        })
      console.log(name.collection("collection").doc("10").status)

</script>
</html>