javascript - 编辑和删除 firebase

Question

   <table>
      <tr>
         <td>Name: </td>
         <td><input type="text" name="user_name" id="user_name"  /></td>
      </tr>
      <tr>
         <td>Phone: </td>
         <td><input type="text" name="user_phone" id="user_phone"  /></td>
      </tr>
      <tr>
         <td>Address </td>
         <td><select name="user_ads" id="user_ads">
             <option value="A">A</option>
             <option value="B">B</option>
             <option value="C">C</option>
             </select>
      <tr>
         <td colspan="2">
             <input type="button" value="Save" onclick="save_user();"  />
             <input type="button" value="Update" onclick="update_user();"  />
         </td>
      </tr>
    </table>

  <table id="users_list" border="1">
   <tr>
       <td>NAME</td>
       <td>PHONE</td>
       <td>ADDRESS</td>
       <td>ACTION</td>
   </tr>
   </table>

   var usersList = document.getElementById('users_list');
   var databaseRef = firebase.database().ref('users/');
   var rowIndex = 1;


   databaseRef.once('value', function(snapshot) {
     snapshot.forEach(function(childSnapshot) {
        var childKey = childSnapshot.key;
        var childData = childSnapshot.val();
        var button = document.createElement("button");
        var button2 = document.createElement("button");
        button.innerHTML = "Edit";
        button2.innerHTML = "Delete";

        var row = usersList.insertRow(rowIndex);
        var cellName = row.insertCell(0);
        var cellPhone = row.insertCell(1);
        var cellAddress = row.insertCell(2);
        var cellButton = row.insertCell(3);
        cellName.appendChild(document.createTextNode(childData.name));
        cellPhone.appendChild(document.createTextNode(childData.phone));
        cellAddress.appendChild(document.createTextNode(childData.address));
        cellButton.appendChild(button);
        cellButton.appendChild(button2);

        button.onclick = delete;
        button2.onclick = edit;

        rowIndex = rowIndex + 1;
     });
    });


    function delete(){
           var row = document.getElementById("users_list");
           firebase.database().ref().child('/users/' + user_id).remove();

           alert('The user is deleted successfully!');

           reload_page();

          }

    function edit {

     }


        function update_user(){

           var data = {
               user_id: user_id,
               user_name: user_name
           }

           var updates = {};
           updates['/users/' + user_id] = data;
           firebase.database().ref().update(updates);

           alert('The user is updated successfully!');

           reload_page();
        }

</script>

我在 firebase 中创建了一个名为 users 的数据库，其中包含数据存储名称、电话和地址。我已经从表中的 firebase 检索了数据，并在表中创建了一个带有编辑按钮和删除按钮的新列。我应该在删除功能中添加什么，以便在单击删除按钮时删除行中的 firebase 数据，单击行中的编辑按钮时将行中的 firebase 数据检索到表格表单，然后单击更新以更新firebase 中的数据。

类似的输出:

Answer 1

使用此代码删除，

考虑到 users 是您的根目录，请使用 users/ 而不是 /users/

  var ref = firebase.database().ref().child('users/' + user_id)
    ref.once("value")
    .then(function(snapshot) {
       snapshot.ref.remove();
       alert("user deleted..!");
   }).catch(function(error) {alert("Data could not be deleted." + error);});

使用此代码进行更新，

       var updates = {};
       updates['/users/' + user_id] = data;
       var ref = firebase.database().ref().child('users/' + user_id)
       ref.update(updates).then(function(){
          ref.on('value', function(snapshot) {
            alert("user updated");
         });
       }).catch(function(error) {alert("Data could not be saved." + error);});