I have a function to render cards with information from my firebase DB.
The div that i'm using at javascript file:
<div class="col-md-4">
<div class="card mb-4 box-shadow">
<img class="card-img-top" data-src="${doc.data().foto}">
<div class="card-body">
<p class="card-text">Local: ${doc.data().local}</p>
<p class="card-text">Descricao: ${doc.data().descricao}</p>
<p class="card-text">Situacao: ${doc.data().situacao}</p>
<div class="d-flex justify-content-between align-items-center">
<div class="btn-group">
<button type="button" class="btn btn-sm btn-outline-secondary" data-toggle="modal" data-target="#myModal">Edit</button>
<button type="button" class="btn btn-sm btn-outline-secondary type="submit" onclick="deleteCard(${doc.id})">Apagar</button>
</div>
</div>
</div>
</div>
</div>
As you can see I need to create a button to delete this information.
I'm trying to pass to the function
function deleteCard(id) {
db.collection("ocorrencias").doc(id).delete().then(function() {
console.log("Document successfully deleted!");
}).catch(function(error) {
console.error("Error removing document: ", error);
});
}
The console tho is sending the me the error:
Uncaught ReferenceError: IcKDt_____pUQcy is not defined
at HTMLButtonElement.onclick (myindexLogged.html:1)
What i'm doing wrong ?
deleteCard(${doc.id})in quotes...deleteCard('${doc.id}')