【问题标题】:Getting MongoDB collection after change in page页面更改后获取 MongoDB 集合
【发布时间】:2016-03-05 00:54:25
【问题描述】:

现在我正在使用 Jade、NodeJS 和 MongoDB 以及 Monk 创建一个网站。

我想要发生的是页面中有更新(在这种情况下,用户移动了谷歌地图),然后使用新参数(更新的纬度和经度)再次从数据库中获取集合,然后该集合用于更新页面上的项目(搜索显示新纬度经度区域中的项目)

这是 get 的 nodejs 代码,目前只显示数据库中的所有内容

router.get('/search', function(req, res) {
    var db = req.db;
    var collection = db.get('items')
    collection.find({},{},function(e,docs){
       res.render('searchAll', {
          "itemlist" : docs
       });
    });
});

还有玉码

each item, i in itemlist
   #{item.stuff}

还有一些在用户移动地图(并获取新的纬度和经度)时激活的 javascript 代码,我不会显示,因为它可以工作。

那么如何调用具有新经纬度的数据库并重新运行该玉代码,以显示更新的 itemList?

编辑

我现在可以从数据库中获取数据,并将其显示在页面上,但是如何让jade(或js?)对新数据进行重复并显示在页面上?

button(onclick="httpGet('/afibo5')")
  | Click
p#response

script(type='text/javascript').
  function httpGet(theUrl){
    //document.write(theUrl);
    $.get(
      theUrl, 
      { id: "532169"}, 
      function(responseText){
        document.getElementById("response").innerHTML=responseText;
      }
    );
  }

【问题讨论】:

  • 谷歌搜索所有内容,我不知道如何解决这个问题,我一般是后端开发人员,对javascript没有太多经验。我基本上希望能够按下一个按钮,该按钮查询数据库并在当前页面上显示结果。

标签: javascript node.js mongodb express pug


【解决方案1】:

绑定点击事件做:window.location.href='/search?lat=5&lon=10';

【讨论】:

  • 但我希望它是无缝的,无需重定向或刷新页面
  • 使用 jquery.ajax 并将 get 请求发送到 /api/search(从我的代码示例中添加额外的路由)
  • 成功了,我将我的翡翠循环移动到一个新的 .jade,让 res 来呈现该页面,然后将 id=response 更新为 responsetext
【解决方案2】:

试试这个:

var _ = require("lodash");
router.get('/search', function(req, res) { 
    req.query = _.pick(req.query, ['lat', 'lon']); // filter query param for exact parameters, if they will not exist it will be empty object
    // query mongo for documents with given lat, lon
    req.db.get('items').find(req.query,{},function(e,docs){
        res.render('searchAll', { "itemlist" : docs }); 
    });
});

// for ajax calls, responds with json, that have to be iterated and rendered using frontend code
router.get('/api/search', function(req, res) { 
    req.query = _.pick(req.query, ['lat', 'lon']);
    req.db.get('items').find(req.query,{},function(e,docs){
        res.json({ "itemlist" : docs }); 
    });
});

【讨论】:

  • 好的,我现在可以从数据库中获取数据,并将其显示在页面上,但是如何让翡翠重申新数据?
  • res.render 会这样做,它会获取视图文件并使用新数据进行渲染。但是,如果您要求使用 Ajax,请告诉我,我将更改代码。
  • 哦,我明白了,但是如何让 javascript 重新加载页面?现在,如果我单击按钮,它就会生成,因此该页面有两个版本。或者只是页面的特定部分(即:只需要更改正文)
  • 绑定点击事件做:window.location.href='/search?lat=5&lon=10';
猜你喜欢
  • 2018-09-29
  • 1970-01-01
  • 2019-07-06
  • 2015-12-01
  • 1970-01-01
  • 2011-10-07
  • 1970-01-01
  • 2016-08-25
  • 1970-01-01
相关资源
最近更新 更多