像按鈕一樣，在數據庫上加減。 nodejs，mongodb，mongoose，jquery

Question

我正在構建一個網站，用戶可以喜歡，像按鈕正在工作，它正在數據庫中存儲喜歡。 我的問題是，我怎麼讓用戶，當他們再次點擊像按鈕，它會減去數據庫。 我有一個類似按鈕的動畫，第一個默認狀態是灰色的，然後當用戶點擊它時，它會變成藍色，並且會出現一個「喜歡」的文字。那麼當用戶再次點擊時，它會回到黑色。

這是我在POST航線代碼（因爲我是將數據添加到數據庫）

app.post("/index/:id", function(req,res){ 
    TestData.findById(req.params.id, function(err, theUser){ 
     if(err){ 
      console.log(err); 
     } else { 
      theUser.likes += 1; 
      theUser.save(); 
      console.log(theUser.likes); 
     } 
    }); 
}); 

我EJS文件：

 <a class="likeicon" href="/index/<%= newUsers._id %>?_method=POST"> 
     <i class="fa fa-thumbs-o-up" aria-hidden="true" ></i> 
     </a> 

和我的jQuery：

$(".likeicon").on('click', function(){ 
if($(this).css("color") === "rgb(0, 0, 255)"){ 
    $("#likedtxt").remove(); 
    $(this).css("color", "black"); 
    $(this).animate({fontSize: "15px"}); 


} else { 
    $(this).css("color", "blue"); 
    $(this).append("<span id='likedtxt'>Liked</span>"); 
    $(this).animate({fontSize: "18px"}); 
} 
}); 

也是另問題，當我點擊喜歡，它正在添加到數據庫，但我怎麼能顯示它活在用戶屏幕上，計數喜歡s是否更新？無需重新加載屏幕。因爲我不想使用res.redirect，它會刷新網頁。

Answer 1

伊莫你可以更好的onclick寫功能爲 「likeicon」 按鈕

<a class="likeicon" userId="<%= newUsers._id %>" onclink="updateLikes()"> 
    <i class="fa fa-thumbs-o-up" aria-hidden="true" > 49 </i> 
</a> 

功能：

function updateLikes() { 
    id = $('.likeicon').attr('userId'); 
    $.post('/index/' + id, function (response) { 
     $('fa-thumbs-o-up').text(response.likeCount); //your counter on a page 
     //and update likes counter with response 
    }) 
} 

而且Node.js的

app.post("/index/:id", function (req, res) { 
    TestData.findById(req.params.id, function (err, theUser) { 
     if (err) { 
      console.log(err); 
     } else { 
      theUser.likes += 1; 
      theUser.save(); 
      console.log(theUser.likes); 
      res.send({likeCount: theUser.likes}); //something like this... 
     } 
    }); 
}); 

Answer 2

有關更新計數喜歡你應該送更新從服務器的喜歡計數：

app.post("/index/:id", function(req,res){ 
    TestData.findById(req.params.id, function(err, theUser){ 
     if(err){ 
      console.log(err); 
      return res.status(500).send('Something went wrong!'); // You should notify user about any error  
     } else { 
      theUser.likes += 1; 
      theUser.save(function(err){ 
      if(err) return res.status(500).send('Something went wrong!'); 
      return res.send({likes_count: theUser.likes}); 
      }); 

     } 
    }); 
});