Estoy tratando de crear un botón para eliminar una fila en mi tabla de la base de datos de Firebase, pero no estoy seguro de cómo elegir una fila específica para eliminar usando una función de botón. Estoy usando javascript y firesource.
La función que estoy usando para llenar mi tabla es
function filled_table_start(num){ document.getElementById("tbody1").innerHTML = ""; members.forEach((member) => { if(member.exists()){ row += '<tr id="student'+ (count+1) +'" >'; row += '<td>' + (count+1) +'</td>'; row += '<td>' + member.data().studentID + '</td>'; row += '<td>' + member.data().name + '</td>'; row += '<td>' + member.data().gender + '</td>'; row += '<td>' + member.data().schoolEmailAdd + '</td>'; row += '<td>' + member.data().handphoneNum + '</td>'; row += '<td><button type="button" onclick= "' + deleteDoc(doc(db,this.studentID ))+'" >Delete User</td>'; //row += '<td>' + row += '</tr>'; document.getElementById('tbody1').innerHTML += row; count ++; }; }); }Me pregunto si algo como this.deleteDoc funcionará. ¿O hay otra función que se puede usar para eliminar una fila específica?
Acabo de crear una tabla de demostración ficticia aquí. Lo que hice fue simplemente darle una clase a cada uno de los botones, cuando haga clic en el botón, encontrará el tr más cercano y lo eliminará.
$("#tbody1").on('click', '.deleteDoc', function () { $(this).closest('tr').remove(); }); table { font-family: arial, sans-serif; border-collapse: collapse; width: 100%; } td, th { border: 1px solid #dddddd; text-align: left; padding: 8px; } tr:nth-child(even) { background-color: #dddddd; } <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <table> <tbody id="tbody1"> <tr> <th>Sl</th> <th>ID</th> <th>Name</th> <th>Gender</th> <th>Mail</th> <th>Mobile</th> <th>Action</th> </tr> <tr id="student1"> <td>1</td> <td>11</td> <td>ABC</td> <td>F</td> <td>abc@gmail.com</td> <td>123456</td> <td><button type="button" class="deleteDoc"> Delete User </td> </tr> <tr id="student2"> <td>2</td> <td>12</td> <td>DEF</td> <td>M</td> <td>def@gmail.com</td> <td>123456</td> <td><button type="button" class="deleteDoc"> Delete User </td> </tr> <tr id="student3"> <td>3</td> <td>13</td> <td>IJK</td> <td>F</td> <td>ijk@gmail.com</td> <td>123456</td> <td><button type="button" class="deleteDoc"> Delete User </td> </tr> </tbody> </table>