Question

我创建了一个添加和删除案例研究的应用程序＆＃39;。我可以轻松添加条目，但是当我尝试删除条目时，我被重定向到表单页面，并在表单页面末尾添加了表单操作URL。当我回到原始表单页面时，该条目实际上已被删除，但理想情况下，我希望能够与添加/删除条目保持同一页面。

form.jade

form(method="POST", action="/form/#{entry._id}?_method=DELETE")
    input(type="submit", value="Delete")

form.js

/* Delete Case Study */
router.delete('/:id', function (req, res) {
  Entry.findById(req.params.id)
    .exec(function(err, entries) {
       // changed `if (err || !doc)` to `if (err || !entries)`
        if (err || !entries) {
            res.statusCode = 404;
            res.send({});
        } else {
            entries.remove(function(err) {
                if (err) {
                    res.statusCode = 403;
                    res.send(err);
                } else {
                    res.send('Deleted entry with link: ', entries.link);
                }
            });
        }
    });
});

以下是我在Heroku上的应用程序的链接，以及我的GitHub回购：

https://hidden-wave-1121.herokuapp.com/form

https://github.com/hlmurray/express-app

这里的任何帮助都会很棒，谢谢！

Answer 1

您可以使用javascript http请求而不是表单发布/提交，并使用删除按钮上的onclick函数连接它，这是一个涵盖http请求的StackOverflow问题。

input(type="button", onclick="deleteItem({entry._id})")

function deleteItem(theID)
{
    var xmlHttp = new XMLHttpRequest();
    xmlHttp.open( "DELETE", '/form/'+ theID, false );
    xmlHttp.send( null );
    return xmlHttp.responseText;
}

此外，您似乎需要在form.js中更新您的路线，以便它读取/ forms /：id。

但是，它不会删除页面上的HTML，因此您需要更多的javascript来删除该DOM元素。通常当我使用MEAN堆栈时，我会使用Angular $ http方法执行所有表单帖子和调用，这样您就不会对页面进行任何更改。我仍然使用表单，但我使用ng-submit代替标准提交，这会阻止页面更改。

希望有所帮助，如果我可以包含其他内容，请告诉我，我会更新答案。

尝试使用Express.js＆amp;删除MongoDB数据库中的条目。玉

1 个答案: