每当我点击删除按钮时，总是第一个项目被删除，而不是我要删除的特定项目

Question

 app.get('/delete', function(req, res, next) { var id = req.query.id; console.log(id); MongoClient.connect(dburl, function(err, db) { if(err) { throw err; } db.collection('shopping_list', function(err, products) { products.deleteOne({_id: mongodb.ObjectID(id)}); if (err){ throw err; }else{ //console.log("deleted"); db.close(); } }); }); });

 <body> <h1> Shopping List </h1> <img src="images/cart.png" id="cart"> <div class="text"> <input type="search" placeholder="Find" id="find"/> <a href="http://www.google.com"><input type="submit" id="find" value="Search" style="background-color: #a3a3c2 ;color:white; width:170px;"></a> </div> <form action="/add" method="POST"> <div class="f"> <a href="http://www.facebook.com"><img src="images/fc.jpg" class="follow"></a> <a href="http://www.twitter.com"><img src="images/twt.jpg" class="follow"></a> <a href="http://www.instgram.com"><img src="images/ins1.jpg" class="follow"></a> </div> <div class="container"> <div class="row"> <div class="col-md-4"> <label style="margin-left: 20px;">Shopping item</label>&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp; <label>Quantity</label> </div> </div> <div class="row"> <div class="col-md-8"> <input type="text" id="item" name="item"/>&emsp;&emsp;&emsp;&emsp; <input type="text" id="quan" name="quan"/>&emsp;&emsp;&emsp;&emsp; <input type="submit" id="submit" value="Add item" style="background-color: #a3a3c2 ; color:white; width:170px;" /> </div> </div> </div> </form> <div class="container"> <div class="row"> <div class="col-md-12"> <table id="tbody"> <tr> <th>Item</th> <th>Quantity</th> </tr> </table> </div> </div> </div> <button id="btn" style="background-color: #a3a3c2 ; color:white; width:170px; margin-left:807px; margin-top:30px;">Clear</button> <script> $(function() { // GET $.ajax({ url: '/render', type: 'get', dataType: 'json', success: function(data) { for (var i = 0; i < data.length; i++) { var trHTML = ''; trHTML += '<tr>'; trHTML += '<td style="display:none" id="id">' +data[i]._id +'</td>'; trHTML += '<td >' + data[i].item + '</td>'; trHTML += '<td >' + data[i].quantity + '</td>'; trHTML += '<td >' + '<button class="delete-button" style="background-color: #a3a3c2 ; color:white; width:170px; margin-left:370px;">Delete</button>' + '</td>'; trHTML += '</tr>'; $('#tbody').append(trHTML); } } }); $(document).ready(function(){ $('table').on('click', '.delete-button', function() { alert("Confirm delete"); var id=$('#id').html(); console.log(id); //var rowEl = $(this).closest('tr'); //var id = rowEl.find('.id').text();*/ $.ajax({ url: '/delete', type: 'get', dataType: 'json', data:{id:id}, success: function(data) { alert("deleted"); //$(this).closest('tr').remove(); } }); }); });

always 1st item get deleted when ever i tap on the delete button not the particular item which i want to delete 每当我点击删除按钮时，总是第一个项目被删除，而不是我要删除的特定项目

every time item which is on the top of the database get deleted when i use the delete button but i want particular item to be delete. 每当我使用删除按钮但我希望删除特定项目时，位于数据库顶部的每次项目都会被删除。 as i provide individual delete button for each item also im facing the same problem. 因为我为每个项目提供单独的删除按钮，所以我也面临相同的问题。

Answer 1

This line is the problem: 这行是问题所在：

var id=$('#id').html();

Because you have multiple cells with the ID of 'id', this assignment picks the first one. 因为您有多个ID为“ id”的单元格，所以此分配选择了第一个。 Change it to this: 更改为此：

var id = $(this).parent().siblings('#id').text();

to get the contents of the 'id' cell on the same row as your delete button. 在与删除按钮相同的行中获取“ id”单元格的内容。

每当我点击删除按钮时，总是第一个项目被删除，而不是我要删除的特定项目

问题描述

1 个解决方案

解决方案1
0 2017-09-25 05:03:12

每当我点击删除按钮时，总是第一个项目被删除，而不是我要删除的特定项目

问题描述

1 个解决方案

解决方案1 0 2017-09-25 05:03:12

解决方案1
0 2017-09-25 05:03:12