always 1st item get deleted when ever i tap on the delete button not the particular item which i want to delete
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>             <label>Quantity</label> </div> </div> <div class="row"> <div class="col-md-8"> <input type="text" id="item" name="item"/>     <input type="text" id="quan" name="quan"/>     <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(); } }); }); });
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.
1 answers
solution1
0 2017-09-25 05:03:12
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. 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.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.
Related Question
When i want to delete one item in my list, everything gets deleted Expo, React Native
Clicking on an item automatically when I delete an item
Why the @keyfame animation property tricking down to below list item? I want to delete a list item to be deleted upon button click using React js
i want to delete an item from local storage
How do I add a title and close button to the top of a menu (above the 1st item in a button menu when clicked in material-ui?
cannot delete array item, the wrong item always gets deleted
I want to make a condition in which if I select this item from 1st drop down show it shows me only selected items in 2nd drop down
onclick on 2nd button,i want 1st as well as 2nd button to be get coloured
How can i delete particular item stored inside local storage?
How do i make the button that's also created with the list item work? I want it to delete the current item of the array. Each item has it own button
Related Tags