如何使用选择菜单变量更改Firebase数据库中的数据

时间:2019-06-01 17:23:47

标签: javascript jquery html firebase variables

当您单击按钮时,下面的我的代码将状态(etat)更改为字符串,但是该字符串之前已预先写入。 我正在尝试制作一个下拉菜单,以将状态(也称为“ etat”)的值更改为菜单中所选项目的值。我似乎无法使其正常工作。

我尝试为所选项目创建变量,但是当我单击按钮时,它似乎删除了我要修改的字段(或使其为null或为空)。

<select id="statuslist" class="browser-default custom-select" style="width: 200px;">
  <option value="" disabled selected>Changer l'état</option>
  <option value="notyet">Pas encore traité</option>
  <option value="inprogress">Au cours de traitement</option>
  <option value="archv">Archivé</option>
</select>
<table class="table" id="ex-table">
  <thead>
    <tr>
      <th scope="col">Date</th>
      <th scope="col">Nom</th>
      <th scope="col">Prénom</th>
      <th scope="col">N° CIN</th>
      <th scope="col">Tel</th>
      <th scope="col">Position</th>
      <th scope="col">Photo d'accident</th>
      <th scope="col">Etat</th>
      <th scope="col">Options</th>
    </tr>
  </thead>
<tbody>
          <script>
      var database = firebase.database();
      database.ref('declaration').once('value', function(snapshot) {
        if (snapshot.exists()) {
          var content = '';
          snapshot.forEach(function(data) {
            var key = data.key;
            var val = data.val();

    $('#ex-table').append("<tr id='"+key+"'><td>"
    +val.date+
    "</td><td>"
   +val.firstName+
   "</td><td>"
   +val.lastName+
   "</td><td>"
   +val.cin.replace('@gmail.com','')+
   "</td><td>"
   +val.numTel+ 
   "</td><td>"
   + "<a href=https://www.google.tn/maps/place/"+val.position+"> My Position </a>"+
   "</td><td>"
   +val.photo+
   "</td><td>"
   +val.etat+
   "</td><td><button id='"+key+"'>CHANGE STATUS</button></td></tr>");

// Fonction de changement d'etat

        $(document).on('click',"#"+key,function(){
            var status = document.getElementById("statuslist").value;
      var database = firebase.database().ref('declaration')
         var newetat = database.child(key);
          newetat.update({
          "etat": status
});

});
          });

        }
      });
    </script>
  </tbody>
</table>

0 个答案:

没有答案