如何从客户端点击查询mongodb现有数据？

Question

我正在创建一个快速应用程序，用户可以在其中搜索电影并将它们添加到列表中。 如果它已经添加到列表中，我想显示“已添加”而不是“已添加到列表”。 单击按钮时，如何从客户端查询此内容。

server.js /搜索路由

app.post('/search', (req, res) => {

    const id = req.body.id;
    const title = req.body.title;
    const rating = req.body.rating;
    const description = req.body.description;

    async function getMovie() {
            await AddedMovie.findOne({id: id}, (err1, succes) => {
            
            if (!succes) {
            
            const movie = AddedMovie({
                id: id,
                title: title,
                rating: rating,
                description: description
            })
    
            movie.save();
        }
        })
    }

    getMovie()
    .then(() => res.redirect('/search'))
    .catch(err => console.log(err));
})

在这里，当单击按钮时，我设法将电影保存到列表中，并且当它已经存在于数据库中时它不会保存。

serach.ejs

const buttons = document.querySelectorAll('.addbtn');
    const ids = document.querySelectorAll('#hidden');
    const titles = document.querySelectorAll('.title');
    const ratings = document.querySelectorAll('.rating');
    const descriptions = document.querySelectorAll('.description')
    const success = document.querySelectorAll('.added');

    for (let i = 0; i < buttons.length; i ++) {
        buttons[i].addEventListener('click', () => {
            
            success[i].innerHTML = 'Successfully added to your list.';
            success[i].style.display = 'inline';
            setTimeout(() => {
                success[i].style.display = 'none';
                success[i].innerHTML = '';
            }, 4000);

            $.post('/search', {id: parseInt(ids[i].textContent), title: titles[i].textContent, rating: parseInt(ratings[i].textContent), description: descriptions[i].textContent })
        })
    }

单击时 div 显示“已添加” ，以前保存在数据库中时如何显示“已存在” 。

Answer 1

更新 server.js 以返回查找/添加的结果。 在您的情况下，如果您的findOne返回成功结果，请在您的响应中返回“已添加”。 如果findOne失败，添加电影并返回“成功添加到您的列表”。

更新您的客户端代码以在按下按钮时说“正在添加到您的列表...”或类似的内容，并将成功处理程序添加到您的post中。

在您的处理程序中，您可以获取从服务器发送的消息并显示它。