How can I delete an object using express .node , mongoose and ejs

Question

I am getting an error deleting an object from the database, however, when I use Postman to test my code it works so I think my ejs syntax is incorrect.

ejs code

                    <center> <a class="delete_category_a" href="/halalMunchies/update-category/<%= category._id%>" style="color: red "> Delete </a> </center>

delete Route

    exports.deleteCategory = (req, res, next) => {

    console.log('DELETE  CATEGORY /delete-category');

    const id = req.params.id;
   

    categorySchema.findByIdAndDelete(id)
        .then(result => {
            //res.redirect('/halalMunchies/all-categories');
            res.send(console.log(result));
        })
        .catch(err => {
            console.log(err);
        });

};

browser error

Cannot GET /halalMunchies/delete-category/6187cb11e3b98a7aa70a277a

The link in your page issues a GET request, but your route is defined for a DELETE request, thus your route is never matched. You also have this link embedded in a form POST, but never actually does anything because nothing submits the form. — jfriend00
– jfriend00, Commented Nov 7, 2021 at 8:57

jfriend00 · Accepted Answer · 2021-11-07 19:28:08Z

1

Your current code is sending a GET request (it's just a plain link), but your request handler is for a DELETE request. The actual <form> in your current code is not doing anything and is not part of the current action.

Because neither a link or a form can directly send a DELETE request, you have these options:

You can use this technique to send a form POST and configure Express to automatically turn it into a DELETE request for you (using middleware) because you can't send a DELETE via a form submission in a browser.
You can use the fetch() interface in Javascript to intercept the click or form post and send the same above POST request that Express will turn into a DELETE request.
You can use the fetch() interface in Javascript to intercept the click or form post and send a DELETE request directly using Javascript.
You can change your Express route to expect a POST and then use either a form submission or a fetch() request that sends the POST.

I would recommend either #1 or #3.

Example code of using fetch() to send a DELETE request:

const url = "/halalMunchies/update-category/<%= category._id%>";

fetch(url, {
    method: "DELETE",
    credentials: "include"
}).then(result => {
   // handle completion here
}).catch(err => {
   // handle error here
});

edited Nov 7, 2021 at 19:28

answered Nov 7, 2021 at 17:12

jfriend00

711k104 gold badges1.1k silver badges1k bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Hesham Eldawy Over a year ago

thanks for this great explanation, and i did what you suggested for using the fetching API method but i faced another problem while firing the javaScript function. here is the question description stackoverflow.com/q/69881107/15454800

SPARTACUS5329 · Accepted Answer · 2021-11-07 13:55:39Z

1

You can use JQuery to create a DELETE request like this

$.ajax({
  type: "DELETE",
  url: `/route`,
  data: { /* as an object */ },

  success: function (data) {
    console.log(data);
  },

  error: function (data) {
    console.error(data);
  },
});

<script src="https://code.jquery.com/jquery-1.12.3.min.js"></script>

Add this tag to use JQuery and after this line, reference the file where you are adding the previous code

This is not a very standard approach but since you are using ejs, this is a very practical solution.

NOTE: The script tag for JQuery might be old, so if you face a problem I suggest getting access to the latest JQuery URL

answered Nov 7, 2021 at 13:55

SPARTACUS5329

13510 bronze badges

1 Comment

SPARTACUS5329 Over a year ago

Add this to an event handler for clicking the element that you want to assign it to

Collectives™ on Stack Overflow

How can I delete an object using express .node , mongoose and ejs

2 Answers 2

1 Comment

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related