I am currently working on an admin panel for a website, utilizing Firebase as the backend database. I have successfully implemented the listings display feature, however, I'm facing an issue where clicking on a specific listing should change its status from 'pending' to 'accept', but it's not happening as expected. I'm struggling to identify the mistake in my code. Any suggestions or insights would be greatly appreciated. Below is the snippet of my pl.js file along with a screenshot of the database.
pl.js
var firebaseheadingRef = firebase.database().ref().child("user");
firebaseheadingRef.on('child_added',datasnapshot=>{
var title= datasnapshot.child("listing").child("title").val();
var userid= datasnapshot.child("username").val();
var type= datasnapshot.child("listing").child("title").val();
var publisheddate= datasnapshot.child("listing").child("publish").val();
var expirydate= datasnapshot.child("listing").child("expire").val();
$("#tablebody").append("<tr><td>"+title+"</td><td>"+userid+"</td><td>"+type+"</td><td>"+publisheddate+"</td><td><button type=button id=accept onclick=accept()>Accept</button><button type=button>Reject</button></td></tr>");
});
function accept()
{
firebaseheadingRef.on('child_changed',datasnapshot=>{
datasnapshot.child("listing").child("status").update({"status":"accept"});
setCommentValues(postElement, data.key, data.val().text, data.val().author);
});
}
database
https://i.sstatic.net/4XxAi.png
This image displays the listing where clicking on the accept button triggers the status update process.