如何使用按钮和 jquery 向节点发送 DELETE 请求?
How to send DELETE request to node with button and jquery?
我有一个显示 "ressource" 的网页(也就是 mongodb 集合中的一个条目),在该网页上我想要一个按钮 "delete"将向服务器发送一个 "delete" 请求到正确的路由。
路由器工作(所以当我使用外部程序发送删除请求时,条目被删除),但我想要与 link.
相同
显然,在做了一些研究之后,我需要使用 ajax 函数来做到这一点,如 this post 中那样。问题是我无法让它工作(可能是因为我刚开始使用jquery),当我点击按钮时似乎没有任何反应。但是如果我尝试一个简单的 alert(),它会起作用 ('#delete').on('click',function(){ alert('clicked')});
。
所以
这是基本的 html :
$('#delete').on('click', function() {
alert('click');
//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">
<head>
<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" />
<!--endbower-->
<!-- 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>
<!--inject:js-->
<script src="/js/app.js"></script>
<script src="/js/modernizr-custom-touch.js"></script>
</head>
<body>
<button class="delete" data-target="/" data-method="DELETE" data-disabled="true">Delete Ressource</button>
</body>
</html>
这是node.js中的路由代码(如果我手动发送DELETE请求,此代码有效),id应该在页面link中
ressourcesRouter.route('/ressources/t/:ressourcesId')
// permet d'afficher UNE ressource spécifique
.get(function(req,res){
var returnRessource = req.ressource.toJSON();
res.render('ressourceView', {
title: 'Ressources',
ressource: returnRessource
});
})
.delete(function(req,res){
req.ressource.remove(function(err){
if(err)
res.status(500).send(err);
else{
res.status(204).send('Removed');
console.log('ressource supprimée');
}
});
});
你能帮我算出需要的 ajax 代码吗?或者还有其他方法吗?
如果需要,请不要犹豫,索取更多代码,我会尽快回复您。
此致。
查看 jQuery ajax 文档:http://api.jquery.com/jquery.ajax/
$.ajax({
url: '/ressources/t/123',
method: 'DELETE',
data: yourdata
})
.done(function( data ) {
console.log(data);
});
<script type="text/javascript">
$(document).ready(function(){
$('table#delTable td a.delete_link').click(function()
{
if (confirm("Are you sure you want to delete this row?"))
{
var id = $(this).parent().parent().attr('id');
var data = 'id=' + id ;
var parent = $(this).parent().parent();
$.ajax(
{
type: "POST",
url: '../scripts/delete_link.php',
data: 'link=' + $(this).attr('data_link') + '&topic_pk=' + $(this).attr('data_topic') + '&topic_introduction=' + $(this).attr('data_introduction'),
cache: false,
success: function()
{
parent.fadeOut('fast', function() {$(this).remove();});
}
});
}
});
});
</script> just look at this. it can solution your problem. Dont Forget your datatable's name
我有一个显示 "ressource" 的网页(也就是 mongodb 集合中的一个条目),在该网页上我想要一个按钮 "delete"将向服务器发送一个 "delete" 请求到正确的路由。 路由器工作(所以当我使用外部程序发送删除请求时,条目被删除),但我想要与 link.
相同显然,在做了一些研究之后,我需要使用 ajax 函数来做到这一点,如 this post 中那样。问题是我无法让它工作(可能是因为我刚开始使用jquery),当我点击按钮时似乎没有任何反应。但是如果我尝试一个简单的 alert(),它会起作用 ('#delete').on('click',function(){ alert('clicked')});
。
所以
这是基本的 html :
$('#delete').on('click', function() {
alert('click');
//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">
<head>
<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" />
<!--endbower-->
<!-- 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>
<!--inject:js-->
<script src="/js/app.js"></script>
<script src="/js/modernizr-custom-touch.js"></script>
</head>
<body>
<button class="delete" data-target="/" data-method="DELETE" data-disabled="true">Delete Ressource</button>
</body>
</html>
这是node.js中的路由代码(如果我手动发送DELETE请求,此代码有效),id应该在页面link中
ressourcesRouter.route('/ressources/t/:ressourcesId')
// permet d'afficher UNE ressource spécifique
.get(function(req,res){
var returnRessource = req.ressource.toJSON();
res.render('ressourceView', {
title: 'Ressources',
ressource: returnRessource
});
})
.delete(function(req,res){
req.ressource.remove(function(err){
if(err)
res.status(500).send(err);
else{
res.status(204).send('Removed');
console.log('ressource supprimée');
}
});
});
你能帮我算出需要的 ajax 代码吗?或者还有其他方法吗? 如果需要,请不要犹豫,索取更多代码,我会尽快回复您。
此致。
查看 jQuery ajax 文档:http://api.jquery.com/jquery.ajax/
$.ajax({
url: '/ressources/t/123',
method: 'DELETE',
data: yourdata
})
.done(function( data ) {
console.log(data);
});
<script type="text/javascript">
$(document).ready(function(){
$('table#delTable td a.delete_link').click(function()
{
if (confirm("Are you sure you want to delete this row?"))
{
var id = $(this).parent().parent().attr('id');
var data = 'id=' + id ;
var parent = $(this).parent().parent();
$.ajax(
{
type: "POST",
url: '../scripts/delete_link.php',
data: 'link=' + $(this).attr('data_link') + '&topic_pk=' + $(this).attr('data_topic') + '&topic_introduction=' + $(this).attr('data_introduction'),
cache: false,
success: function()
{
parent.fadeOut('fast', function() {$(this).remove();});
}
});
}
});
});
</script> just look at this. it can solution your problem. Dont Forget your datatable's name