Xogno Xogno - 1 year ago 84
Node.js Question

How to send DELETE request to node with button and jquery?

I have a web page that's showing a "ressource" (aka just one entry from a mongodb collection), and on that web page I want to have a button "delete" that will send a "delete" request to the server to the correct route.
The router works (so when I use an external program to send a delete request, the entry is deleted), but I want to the same with a link.

Apparently, after doing some research, I would need to use an ajax function to do that, as in this post. The problem is that I can't make it work (probably because I just started using jquery), it seems nothing happens when I click on the button. But if I try a simple alert(), it works

('#delete').on('click',function(){ alert('clicked')});


Here's the basic html :

$('#delete').on('click', function() {
//here would be the code to send the DELETE request ?

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<!DOCTYPE html>
<html lang="en">

<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<meta charset="utf-8">
<title>Storystrap Template</title>
<meta name="generator" content="Bootply" />
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<!-- bower:css -->
<link rel="stylesheet" href="/lib/bootstrap/dist/css/bootstrap.min.css" />
<link rel="stylesheet" href="/lib/font-awesome/css/font-awesome.min.css" />
<!-- bower:js -->
<script src="/lib/jquery/dist/jquery.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script src="/lib/bootstrap/dist/js/bootstrap.js"></script>
<script src="/js/printplugin.min.js"></script>

<script src="/js/app.js"></script>
<script src="/js/modernizr-custom-touch.js"></script>


<button class="delete" data-target="/" data-method="DELETE" data-disabled="true">Delete Ressource</button>


And here is the route code in node.js (this code works if I manually send a DELETE request), the id is supposed to be in the link of the page

// permet d'afficher UNE ressource spécifique

var returnRessource = req.ressource.toJSON();

res.render('ressourceView', {
title: 'Ressources',
ressource: returnRessource

console.log('ressource supprimée');

Could you help me out to figure the ajax code needed ? or is there another way ?
Don't hesitate to ask for more code if needed, I'll be as reactive as possible to answer you quickly.

Best regards.

Answer Source

Take a look at the jQuery ajax docs: http://api.jquery.com/jquery.ajax/

  url: '/ressources/t/123',
  method: 'DELETE',
  data: yourdata
  .done(function( data ) {
Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download