时间戳

首页 > 解决方案 > 使用 Express 和 Handlebars，如何从数据库中预填充或重新加载选择菜单选项？

node.js - 使用 Express 和 Handlebars，如何从数据库中预填充或重新加载选择菜单选项？

问题描述

我有一个正在处理的用户更新表单。用户可以从选择菜单中选择一个选项，该选项作为字符串保存到数据库中。

<select name="morality" id="morality">
  <option value="">Choose down below!</option>
  <option value="Good"> Good</option>
  <option value="Neutral">Neutral</option>
  <option value="Evil">Evil</option>
</select>

当用户选择一个选项时，我可以发布到数据库。当我重新加载页面时，我想获取选择的值并使用它将选择的属性添加到相应的选项。因此，如果有人选择 Neutral 并保存它，我想展示...

<select name="morality" id="morality">
  <option value="">Choose down below!</option>
  <option value="Good"> Good</option>
  <option value="Neutral" selected >Neutral</option>
  <option value="Evil">Evil</option>
</select>

标签： node.jsmongodbexpresshandlebars.js

解决方案

渲染页面时必须传递值morality才能查看： 

router.get('/edit/:id', function(req, res) {
  Model.findOne({_id:req.params.id},function(err,data){
      if(!err && data){
         res.render('home',{morality:data.morality});
          // or you can pass whole data object to view 
          //res.render('home',{data:data});
          // inside view {{data.morality}}
      }
  });
});

并在视图中添加这样的条件：

<select name="morality" id="morality">
  <option value="" {{morality==''?'selected':''}}>Choose down below!</option>
  <option value="Good" {{morality=='Good'?'selected':''}}> Good</option>
  <option value="Neutral" {{morality=='Neutral'?'selected':''}}>Neutral</option>
  <option value="Evil"  {{morality=='Evil'?'selected':''}}>Evil</option>
</select>

推荐阅读