in node.js I can't get form data into mongodb and back out to display on webpage using mongoose

Question

I a trying to set up an app that the user can simply input data about themselves and then have that data be displayed on the web page later. I am using passport for local authentication and then the web app displays an html form in which the user can input their data and then have the data displayed on the following page, but I get an error every time I test it. I was planning on using the users username from authentication as the database 'identifier' but if there is another way of locating the data please let me know.

here is the html form for the data which is lengthy because of the dropdowns

<div id="userinfo">
    <form id="infoform" action="/profile" method="POST">
    <center><h1><i>User Information</i></h1></center>
    <center><h3>Enter Firstname:  <input type="text" name="firstname" id="fname"></input></h3></center>
    <center><h3>Enter Lastname:  <input type="text" name="lastname" id="lname"></input></h3></center>
    <center><h3>Birthday:  
        <select name="birthmonth" id="bmonth">
            <option value="January">January</option>
            <option value="Febuary">Febuary</option>
            <option value="March">March</option>
            <option value="April">April</option>
            <option value="May">May</option>
            <option value="June">June</option>
            <option value="July">July</option>
            <option value="August">August</option>
            <option value="September">September</option>
            <option value="Octopber">October</option>
            <option value="November">November</option>
            <option value="December">December</option>
        </select>
        <select name="birthday" id="bday">
            <option value="1">1</option>
            <option value="2">2</option>
            <option value="3">3</option>
            <option value="4">4</option>
            <option value="5">5</option>
            <option value="6">6</option>
            <option value="7">7</option>
            <option value="8">8</option>
            <option value="9">9</option>
            <option value="10">10</option>
            <option value="11">11</option>
            <option value="12">12</option>
            <option value="13">13</option>
            <option value="14">14</option>
            <option value="15">15</option>
            <option value="16">16</option>
            <option value="17">17</option>
            <option value="18">18</option>
            <option value="19">19</option>
            <option value="20">20</option>
            <option value="21">21</option>
            <option value="22">22</option>
            <option value="23">23</option>
            <option value="24">24</option>
            <option value="25">25</option>
            <option value="26">26</option>
            <option value="27">27</option>
            <option value="28">28</option>
            <option value="29">29</option>
            <option value="30">30</option>
            <option value="31">31</option>
        </select>
        <select name="birthyear" id="byear">
            <option value="2015">2015</option>
            <option value="2014">2014</option>
            <option value="2013">2013</option>
            <option value="2012">2012</option>
            <option value="2011">2011</option>
            <option value="2010">2010</option>
            <option value="2009">2009</option>
            <option value="2008">2008</option>
            <option value="2007">2007</option>
            <option value="2006">2006</option>
            <option value="2005">2005</option>
            <option value="2004">2004</option>
            <option value="2003">2003</option>
            <option value="2002">2002</option>
            <option value="2001">2001</option>
            <option value="2000">2000</option>
            <option value="1999">1999</option>
            <option value="1998">1998</option>
            <option value="1997">1997</option>
            <option value="1998">1998</option>
            <option value="1997">1997</option>
            <option value="1996">1996</option>
            <option value="1995">1995</option>
            <option value="1994">1994</option>
            <option value="1993">1993</option>
            <option value="1992">1992</option>
            <option value="1991">1991</option>
            <option value="1990">1990</option>
            <option value="1989">1989</option>
            <option value="1988">1988</option>
            <option value="1987">1987</option>
            <option value="1986">1986</option>
        </select>
    </h3></center>
    <center><h3>Sex:  <input type="radio" name="sex" value="male">Male   <input type="radio" name="sex" value="female">Female
    <center><h3>Enter Email:  <input type="email" name="useremail" id="email" cols="15" rows="1"></input></h3></center>
    <center><h3>High School Education: <input type="text" name="hsedu" id="hs"></input></h3></center>
    <center><h3>Graduation Year: 
    <select name="hsgradyear" id="hsgrad">
            <option value="2015">2015</option>
            <option value="2014">2014</option>
            <option value="2013">2013</option>
            <option value="2012">2012</option>
            <option value="2011">2011</option>
            <option value="2010">2010</option>
            <option value="2009">2009</option>
            <option value="2008">2008</option>
            <option value="2007">2007</option>
            <option value="2006">2006</option>
            <option value="2005">2005</option>
            <option value="2004">2004</option>
            <option value="2003">2003</option>
            <option value="2002">2002</option>
            <option value="2001">2001</option>
            <option value="2000">2000</option>
            <option value="1999">1999</option>
            <option value="1998">1998</option>
            <option value="1997">1997</option>
            <option value="1998">1998</option>
            <option value="1997">1997</option>
            <option value="1996">1996</option>
            <option value="1995">1995</option>
            <option value="1994">1994</option>
            <option value="1993">1993</option>
            <option value="1992">1992</option>
            <option value="1991">1991</option>
            <option value="1990">1990</option>
            <option value="1989">1989</option>
            <option value="1988">1988</option>
            <option value="1987">1987</option>
            <option value="1986">1986</option>
        </select>
    </h3></center>
    <center><h3>College Education: <input type="text" name="colledu" id="coll"></input></h3></center>
    <center><h3>Graduation Year: 
    <select name="collgradyear" id="collgrad">
            <option value="2015">2015</option>
            <option value="2014">2014</option>
            <option value="2013">2013</option>
            <option value="2012">2012</option>
            <option value="2011">2011</option>
            <option value="2010">2010</option>
            <option value="2009">2009</option>
            <option value="2008">2008</option>
            <option value="2007">2007</option>
            <option value="2006">2006</option>
            <option value="2005">2005</option>
            <option value="2004">2004</option>
            <option value="2003">2003</option>
            <option value="2002">2002</option>
            <option value="2001">2001</option>
            <option value="2000">2000</option>
            <option value="1999">1999</option>
            <option value="1998">1998</option>
            <option value="1997">1997</option>
            <option value="1998">1998</option>
            <option value="1997">1997</option>
            <option value="1996">1996</option>
            <option value="1995">1995</option>
            <option value="1994">1994</option>
            <option value="1993">1993</option>
            <option value="1992">1992</option>
            <option value="1991">1991</option>
            <option value="1990">1990</option>
            <option value="1989">1989</option>
            <option value="1988">1988</option>
            <option value="1987">1987</option>
            <option value="1986">1986</option>
        </select><br><br>
        <center><input type="submit" value="Enter Info"></input></center>
        </form>
</div>

and here is part of the server code

app.get('/profile', isLoggedIn, function(req, res){

    res.render('profile', {
        user : req.user,
    });
});

app.post('/profile', function(req, res, userinfo) {

    console.log(req.body);
    var userinfo = new userinfo();
    userinfo.info.username = req.user.local.username
    userinfo.info.firstname = req.body.firstname
    userinfo.info.lastname = req.body.lastname
    userinfo.info.birthmonth = req.body.birthmonth
    userinfo.info.birthday = req.body.birthday
    userinfo.info.birthyear = req.body.birthyear
    userinfo.info.sex = req.body.sex
    userinfo.info.email = req.body.email
    userinfo.info.hsedu = req.body.hsedu
    userinfo.info.hsgradyear = req.body.hsgradyear
    userinfo.info.colledu = req.body.colledu
    userinfo.info.collgradyear = req.body.collgradyear

    userinfo.save(function(err, userinfo){
        if(err)
            throw err;
    })

     res.redirect('/userprofile');
})

app.get('/userprofile', function(req, res) {

    userinfo.findOne({'info.username' : 'req.user.local.username'}, function(err, userinfo) {
        if(err)
            return handleError(err);
    })


    res.render('userprofile', {
        userinfo : userinfo,
        user : req.user
    })
})

score 1 · Accepted Answer · edited May 23 '17 at 12:14

1

You have a conflict in naming, using the same identifier as both the constructor and variable:

var userinfo = new userinfo();

The var will be hoisted, leading it to shadow the constructor, so the line essentially becomes:

var userinfo;
userinfo = new undefined();

For this, you could follow the convention of naming the constructor with a capital letter to distinguish it:

// you haven't shown how it's declared, but I'm assuming in another module for the example
var UserInfo = require('./models/userinfo');

var userinfo = new UserInfo();

This naming conflict also affects the render() used in app.get('/userprofile', ...);. Currently, the value provided as a local to the view is the constructor itself rather than the individual document.

The document variable only exists inside the callback function provided to .findOne(). So, to pass it along as a local, you'll need to perform the .render() within that function:

UserInfo.findOne(..., function (err, userinfo) {
    res.render('userprofile', {
        userinfo : userinfo,
        user : req.user
    });
});

You'll also want to remove the quotes around the value in the query object:

UserInfo.findOne({'info.username' : req.user.local.username}, ...);

The key is expected to represent a property path and the quotes are needed to allow the . to be included, so quoting it is fine.

But, by quoting the value, the query will look for a document holding "req.user.local.username" as an exact string value rather than accessing properties of the req object.

edited May 23 '17 at 12:14

Community

1
1

answered Jun 28 '15 at 15:16

Jonathan Lonowski

121,453
34
200
199

Ok, I made all of the corrections but I still am not getting to the '/userprofile' page and receiving instead an error. – justin Jun 28 '15 at 15:44
could it be having to do with the req.user.local.username? isn't that how you write the authentication username variable? – justin Jun 28 '15 at 15:46
@justin What error are you receiving? Whether `req.user.local.username` is accurate depends on how `req.user` is defined, and that isn't clear from your post. If it refers to a `UserInfo` document, then the `local` should probably be `info` instead. – Jonathan Lonowski Jun 28 '15 at 15:50
when I do the post by hitting enter from the form instead of being redirected like the res.redirect('/userprofile') defines I get a 404 error page. Which I assume is the if(err) throw err part of the code. – justin Jun 28 '15 at 15:56
I didn't show the authentication part of the server which I accomplished using passport local and is where the local.username came from. basically a completely different collection in the database – justin Jun 28 '15 at 15:58
Thanks for the input anyway, it was helpful – justin Jun 28 '15 at 15:59

score 0 · Answer 2 · answered Jun 28 '15 at 15:10

In your code, you should write your res.render('userprofile'...) and res.redirect('/userprofile'); should inside the corresponding callbacks

userinfo.findOne(...., callback);
userinfo.save(callback);

Moreover var userinfo = new userinfo(); is defined in another method, not in that method, better write a function and call it here

Therefore the following code should be a correct way

app.get('/userprofile', function(req, res) {

    //code for var userinfo = new userinfo();
    .....
    .....
    userinfo.findOne({'info.username' : 'req.user.local.username'}, function(err, userinfo) {
      if(err)
          return handleError(err);

      res.render('userprofile', {
        userinfo : userinfo,
        user : req.user
      });

   });

});

in node.js I can't get form data into mongodb and back out to display on webpage using mongoose

2 Answers2