Thimxo
Thimxo

Reputation: 31

Retrieve data from Mongodb via form input and pug template renderer

I'm currently stuck with the following problem: I can't retrieve any data from my mongoDB and display it on the client side or simply on another route. I have used several attempts such as:

app.get('/output', function(req, res){
  Users.find(function (err, users){
    res.render('help', {users: users});
  });
});

However, this ends in 'Users is not defined'. When using the mongo shell and querying 'show collections', I find the 'users' collection with the data from the form input.

I would highly appreciate, if someone could explain to me how to retrieve the data based on the code below and display in 'index.pug' like #{users.firstName}.

App.js code:

var express = require('express');
var app = express();
var router = express.Router();
var mongoose = require('mongoose');
var bodyParser = require('body-parser');
var methodOverride = require('method-override');


app.get('/', function (req, res) {
  res.render('index', function(err, html) {
    res.send(html);
  });
});

app.set('view engine', 'pug');
app.set('views', __dirname + '/views');

app.use(bodyParser.urlencoded({ extended: false }));
app.use(bodyParser.json());
app.use(methodOverride('_method'));
app.use(express.static(__dirname + '/public'));

mongoose.connect('mongodb://localhost/myexpressapp');

var Schema = new mongoose.Schema({
  _id : String,
  firstName : String,
  lastName : String,
  City : String,
  Country : String
});

var user = mongoose.model('user', Schema);

app.post('/send', function(req, res){
  new user({
    _id: req.body.email,
    firstName: req.body.firstName,
    lastName: req.body.lastName,
    City: req.body.city,
    Country: req.body.country
  }).save(function(err, doc){
      if(err) res.json(err);
      else res.send('Successfully inserted');
  });
});

app.listen(3000, function () {
  console.log('Example app listening on port 3000!');
}); 

index.pug code:

doctype html
html(lang='en')
  head
    meta(charset='utf-8')
    meta(http-equiv='X-UA-Compatible', content='IE=edge')
    meta(name='viewport', content='width=device-width, initial-scale=1')
    // The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags
    // Bootstrap
    link(href='css/bootstrap.min.css', rel='stylesheet')
    // HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries
    // WARNING: Respond.js doesn't work if you view the page via file://
    //if lt IE 9
      script(src='https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js')
      script(src='https://oss.maxcdn.com/respond/1.4.2/respond.min.js')
  body
  form(action='/send' method='POST')
    | Email:
    br
    input(type='text', name='email', value='#{user.firstName}')
    br
    | First Name:
    br
    input(type='text', name='firstName', value='')
    br
    | Last Name:
    br
    input(type='text', name='lastName', value='')
    br
    | City:
    br
    input(type='text', name='city', value='')
    br
    | Country:
    br
    input(type='text', name='country', value='')
    br
    input(type='submit', value='Submit')

    // jQuery (necessary for Bootstrap's JavaScript plugins)
    script(src='https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js')
    // Include all compiled plugins (below), or include individual files as needed
    script(src='js/bootstrap.min.js')

Upvotes: 0

Views: 3257

Answers (2)

Thimxo
Thimxo

Reputation: 31

Miracles happen, once you refuse to give up. I figured it out, in case anyone is stuck with this, here's the working code:

app.js

app.get('/retrieve', function(req, res){
    post.find({}, function(err, docs){
        if(err) res.json(err);
        else    res.render('retrieve', {posts: docs});
    });
});

index.pug

html
  head
    title Registration Form
  body
ul
each post in posts
    form(action='', method='POST')
      label(for='post[email]') Email:
      input(type='text', name="post[_id]", value=post._id)
      br
      label(for='post[name]') Name:
      input(type='text', name="post[name]", value=post.name)
      br
      label(for='post[age]') Age:
      input(type='text', name="post[age]", value=post.age)
      br
      input(type='submit')

Upvotes: 0

Kostas
Kostas

Reputation: 1903

You have to use user which you defined as a model var user = mongoose.model('user', Schema);

So the correct usage of find would be:

user.find(...)

If you'd like to use Users.find then you should declare the model like this var Users = mongoose.model('user', Schema);

Upvotes: 1

Related Questions