0

So my concern here is that I'm making a Family Finance App and I have structured by Firebase Realtime database like such /Users/UID/Family/FamilyMemberName now that is the path after that I want the data inside "FamilyMemberName" to be appended to a HTML Bootstrap Table however I'm not able to do so with the following code.

firebase
 .database()
 .ref("/Users/" + uid + "/Family/")
 .on("child_added", (snap) => {
   var FamilyMemberName = snap.child("MemberName").val();
   var FamilyMemberDOB = snap.child("MemberDOB").val();
   var FamilyMemberEmail = snap.child("MemberEmail").val();
   var FamilyMemberContact = snap.child("MemberContact").val();

$("#familyDetails").append(
  "<tr><td>" +
    FamilyMemberName +
    "</td><td>" +
    FamilyMemberDOB +
    "</td><td>" +
    FamilyMemberEmail +
    "</td><td>" +
    FamilyMemberContact +
    "</td></tr>"
  );
});

This is the structure of my Firebase Database

So with this structure and code is there something I am doing incorrectly or is it totally wrong. It would be great if someone could help me out.

Frank van Puffelen
  • 565,676
  • 79
  • 828
  • 807
Sushant Krishna Agarwal
  • 15
  • 4
  • When you set breakpoints on each important line and then step through the code in a debugger, which is the first line that doesn't do what you expect it to do? – Frank van Puffelen Mar 31 '21 at 18:16
  • The question is tagged with `datatables` - meaning [this jQuery library](https://datatables.net/). Is that what you are actually using? (You refer to "HTML Bootstrap Table"). – andrewJames Mar 31 '21 at 19:30
  • @andrewjames I'm Using Bootstrap DataTables (https://datatables.net/examples/styling/bootstrap4) in my HTML Page – Sushant Krishna Agarwal Apr 01 '21 at 02:56
  • @FrankvanPuffelen well thats the problem, the code is not returning an error which I could possible fix or share. – Sushant Krishna Agarwal Apr 01 '21 at 02:57
  • I'd recommend learning how to use a debugger. For example, see https://stackoverflow.com/questions/10638059/javascript-debugging-line-by-line-using-google-chrome - but there are many more tutorials out there. Stack Overflow is notoriously inefficient as an interactive debugger, but once you can pinpoint the problem to a line or a few lines, we can often help much more efficiently. – Frank van Puffelen Apr 01 '21 at 03:52
  • @FrankvanPuffelen Thank you for the suggestion. At this point, I will surely have to look into a Debugger in this case. – Sushant Krishna Agarwal Apr 01 '21 at 04:33
  • 1
    I don't know what your specific problem is (there are no details in your question), but you cannot add a row to a DataTable by appending a string of HTML to the `` DOM element. Use the DataTables API to [add rows](https://datatables.net/reference/api/row.add()).
     – andrewJames Apr 01 '21 at 12:45

0 Answers0