Javascript- How to delete firestore row data by firestore Id in html table

[ranaankursinh]

i’m trying to delete particular row data on button click.
js code is below:

/* ========================|City Get|====================== */
  const listcitydata = document.querySelector("#listcitydata");
  var srno = 0; 
  var first = db.collection("citymaster").orderBy("cityname", "asc");
  
     first.get().then(function (querySnapshot) {
        querySnapshot.forEach(function (doc) {
            srno++;
            let tr = document.createElement('tr');
            tr.setAttribute('data-id', doc.id);
            listcitydata.innerHTML += "<td>" + srno + "</td> <td>" +  doc.id + "</td> <td>" + doc.data().cityname + "</td> <td>" + '<input id="Button" class="btn btn-danger" type="button" value="Delete" onclick="DeleteCityMasterData()" />' + "</td> "
        });
     });
/* ========================|City Delete|====================== */
     function DeleteCityMasterData(id) {
         if (confirm("Are you sure you want to Delete City Name? ",id)) {
             db.collection("citymaster").doc(id).delete().then(function () {
                 console.log("Document successfully deleted!");
                 window.alert("City Name Delete!");
             }).catch(function (error) {
                 console.error("Error removing document: ", error);
             });
         }
         else {
             window.alert("Cancel!");
         }
     }
/* ==================================================================== */

how to pass parameter throw id (doc.id) to the delete function.

[m_hutley]

@ranaankursinh

onclick="DeleteCityMasterData()

@ranaankursinh

function DeleteCityMasterData(id) {

Well, the simplest answer is going to be ‘fix the first bit to actually send the id to the second bit. Right now its sending nothing.’

[ranaankursinh]

thanks for replay,

code:

<input id=“btnDeleteCity” class=“btn btn-danger” type=“button” value="Delete"onclick=“DeleteCityMasterData(‘+id+’)” />

pass id but getting error:

index.html:1 Uncaught ReferenceError: AtL4nkBNDRCPTuIE1CF6 is not defined at TMLInputElement.onclick (index.html:1)
onclick @ index.html:1

[m_hutley]

Doesn’t make much sense for a ReferenceError - you’re not referring to anything at that point.

What does it show you when you click on the index.html:1 link in that error message?

[ranaankursinh]

solution: