如何用节点JS创建ajax POST?

时间:2013-07-18 03:50:21

标签: javascript node.js pug

我不知道如何使用ajax POST从Jade Page发布到Node JS。如果有人可以提供一个例子或告诉我我的脚本中缺少的内容,请告诉我。

这是脚本文件:

  //Add friends
    $('.addContact').click(function() {
    $.post('/addContact',
       {friendRequest: $(this).data('user')});

    if($(this).html!=='Contact Requested') {
        return $(this).html('Contact Requested');
    }
    });  

我在app.js文件上发布POST的网址是:

app.post('/addContact', user.addContactPost);

如果db中的数据显示为true,我试图在按钮Add Contact上为click事件发布true,并将其更改为Contact Requested。

这是玉文件:

extends layout
block content   
    div
    legend Search Results
    div#userResults
    for user in ufirstName 
        a(href='/user/#{user.id}')
            p #{user.firstName} #{user.lastName}
        button.addContact Add Contact

路线文件是:

    exports.addContactPost = function(req, res, err) {
    User.findByIdAndUpdate(req.signedCookies.userid, {
                $push: {friendRequest: req.body.friendRequest}
            }, function(err) {
                if(err) {
                    console.log("post2");
                    return console.log('error');
                    //return res.render('addContactError', {title: 'Weblio'}); 

                } 

                else {
                    console.log('postsuccess');
                    //alert('Contact added');
                    res.json({response: true});

                }

            });
};

2 个答案:

答案 0 :(得分:0)

如果您要发布AJAX请求,那么您希望客户端的JS能够得到一些响应,并相应地对此响应作出反应。 如果它是对另一个页面的单独请求 - 那么可能渲染整个页面 - 将是实际选项。

但是,由于您只需要从服务器获取响应,然后根据响应更新前端而不重新加载,那么您需要使用一些JSON在此POST请求上从服务器响应。然后在客户端,做一些模板,在客户端使用jQuery或一些模板库。

答案 1 :(得分:0)

一切看起来都不错我认为$ .post代码有点偏差。这可能会解决您的问题。

 $('.addContact').click(function() {
    $.post('/addContact', { addContact : true }, function(data){
        console.log('posting...');
        $('.addContact').html(data);
    });

    ...
});

我添加到$ .post的对象是将要发送到服务器的对象。您最后指定的功能是回调。它会在函数返回时被调用。我认为这可能是你的一些困惑。

你的节点路线应该是这样的

exports.addContactPost = function(req, res, err) {
    User.findByIdAndUpdate(req.signedCookies.userid,{
            addContact: req.body.addContact
        }, function(err) {
            if(err) {
                console.log("post2");
                res.render('addContactError', {title: 'Weblio'}); 
            } 
            //assuming express return a json object to update your button
            res.json({ response  : true });
        });
};