title: Node.js, Express and Jade - Forms
body: <p>I'm using Node.js, Express and Jade and I'm trying to figure out how to post, validate &amp; process form data.</p>
  
  <p>In my jade file I create a contact form:</p>
  
  <pre><code>div#contact-area
      form(method='post',action='')
          label(for='name') Name:
          input(type='text',name='name',id='name')        
          label(for='email') Email:
          input(type='text',name='email',id='email')  
          input(type='submit',name='submit',value='Submit').submit-button
  </code></pre>
  
  <p>I'm then utilising the module 'express-validator' to validate the form as follows:</p>
  
  <pre><code>var express = require('express')
      ,routes = require('./routes')
      ,http = require('http')
      ,path = require('path')
      ,expressValidator = require('express-validator')
  ;
  
  var app = express.createServer();
  
  app.configure(function(){
      app.set('views', __dirname + '/views');
      app.set('view engine', 'jade'); //not needed if we provide explicit file extension on template references e.g. res.render('index.jade');
      app.use(express.bodyParser());
      app.use(expressValidator);
      app.use(express.methodOverride());
      app.use(app.router);
  });
  
  //display the page for the first time
  app.get('/mypage', function(req,res){
      res.render('mypage', { 
          title: 'My Page'        
      });            
  });
  //handle form submission
  app.post('/mypage', function(req,res){
      req.assert('name', 'Please enter a name').notEmpty();
      req.assert('email', 'Please enter a valid email').len(6,64).isEmail();
  
      var errors = req.validationErrors();
      if( !errors){   
          sendEmail(function(){
              res.render('mypage', { 
                  title: 'My Page',
                  success: true
              });
          });
      }
      else {
          res.render('mypage', { 
              title: 'My Page',
              errors: errors
          });
      }
   });
  </code></pre>
  
  <p>So there are three scenarios where my pages is rendered, and each one has access to different local variables:</p>
  
  <ol>
  <li>When the page is loaded for the first time (errors=undefined,success=undefined)</li>
  <li>When the form is submitted and there are errors (errors=array,success=undefined)</li>
  <li>When the form is submitted and there are no errors (errors=undefined,success=true)</li>
  </ol>
  
  <p>So my main problems are that:</p>
  
  <ol>
  <li>When my Jade page is loaded, it seems to throw an error when I attempt to access a variable that doesn't exist. For example, I want to see if the variable 'success' is set, and if it is I want to hide the form and display a "thanks" message. Is there an easy way to handle a variable in Jade that will either be undefined or a value?</li>
  <li>When the form has been submitted and there are validation errors, I want to show an error message (this isn't a problem) but also populate the form with the variables that were previously submitted (e.g. if the user provided a name but no email, the error should reference the blank email but the form should retain their name). At the moment the error message is displayed but my form is reset. Is there an easy way to set the input values of the fields to the values in the post data?</li>
  </ol>