title: Firebase Realtime database update
body: <p>Hello guys my firebase real-time database update function is updating all the data with new data, I'm attaching the image of the database before the update</p>
  <p><img src="https://i.stack.imgur.com/iYQFG.png" alt="1" /></p>
  <p>And after the update all the fields of A and B are changed into C, the source code is available below :</p>
  <p>Frontend:</p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>  &lt;form onsubmit="return false"&gt;
                      &lt;input type="hidden" id="hiddenId"&gt;
                      &lt;div class="form-row"&gt;
                        &lt;div class="form-group col-12"&gt;
                          &lt;label class="uname"&gt;Course Code&lt;/label&gt;
                          &lt;input type="text" class="form-control uname-box" id="popupCourseCode" aria-describedby="emailHelp" placeholder="Course Code"&gt;
                        &lt;/div&gt;
                      &lt;/div&gt;
                      &lt;div class="form-row"&gt;
                        &lt;div class="form-group col-12"&gt;
                          &lt;label class="uname"&gt;Course Title&lt;/label&gt;
                          &lt;input type="text" class="form-control uname-box" id="popupCourseTitle" aria-describedby="emailHelp" placeholder="Course Title"&gt;
                        &lt;/div&gt;
                      &lt;/div&gt;
                      &lt;div class="form-row"&gt;
                        &lt;div class="form-group col-12"&gt;
                          &lt;label class="uname"&gt;Subject&lt;/label&gt;
                          &lt;input type="text" class="form-control uname-box" id="popupSubject" aria-describedby="emailHelp" placeholder="Subject"&gt;
                        &lt;/div&gt;
                      &lt;/div&gt;
                      &lt;div class="form-row"&gt;
                        &lt;div class="form-group col-12"&gt;
                          &lt;label class="uname"&gt;Credits&lt;/label&gt;
                          &lt;input type="number" class="form-control uname-box" id="popupCredits" aria-describedby="emailHelp" placeholder="Credits"&gt;
                        &lt;/div&gt;
                      &lt;/div&gt;
                      &lt;div class="form-row"&gt;
                        &lt;div class="form-group col-12"&gt;
                          &lt;label class="uname"&gt;Grades&lt;/label&gt;
                          &lt;input type="text" class="form-control uname-box" id="popupGrades" aria-describedby="emailHelp" placeholder="Grades"&gt;
                        &lt;/div&gt;
                      &lt;/div&gt;
                  &lt;/form&gt;</code></pre>
  </div>
  </div>
  </p>
  <p>Function:</p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-css lang-css prettyprint-override"><code>function update() {
    firebase.database().ref('academics').orderByKey().once('value',  snap =&gt; {
      snap.forEach((data) =&gt; {
       
        var popupCourseCode = document.getElementById('popupCourseCode');
        var popupCourseTitle = document.getElementById('popupCourseTitle');
        var popupSubject = document.getElementById('popupSubject');
        var popupCredits = document.getElementById('popupCredits');
        var popupGrades = document.getElementById('popupGrades');
        
          var updates = {
            courseCode: popupCourseCode.value,
            courseTitle: popupCourseTitle.value,
            subject: popupSubject.value,
            credits: popupCredits.value,
            grade: popupGrades.value,
          }
        
          firebase.database().ref('academics/' + data.key).update(updates)
        
          // alert('updated')
    
          console.log(`Update FunctionKey!!!!!!!!!!!! &gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt; ${data.key}`)
      })
      // console.log(`Remove FunctionKey!!!!!!!!!!!! &gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt; ${data.key}`)
    })
    
  }</code></pre>
  </div>
  </div>
  </p>
  <p>Please provide me a solution. Thanks in anticipation</p>