create folder views
and index.ejs
<!DOCTYPE html>
<html>
<head>
<title>TODO List</title>
</head>
<body>
<h2>TODOs List</h2>
<ol>
<% for( var i in tasks ) { %>
<li><input type="text" name="tasks[]" value="<%= tasks[ i ]; %>" /></li>
<% } %>
</ol>
<form action="" method="post"
onkeydown=" if( event.keyCode == 13 ) this.submit(); ">
<ol>
<% for( var i in tasks ) { %>
<li><input type="text" name="tasks[]" value="<%= tasks[ i ]; %>" /></li>
<% } %>
</ol>
</form>
</body>
</html>
in app.js
/ Use 'ejs' as the template engine
app.set( 'view engine', 'ejs' );
// Point unrouted requests to the 'views' directory
app.use( express.static( 'views' ) );
// Respond to any requests from the browsers..
app.all( '/', function( req, res ){
// Render index.ejs using a predefined list of tasks
res.render( 'index', {
tasks: [ 'Create Node.js App', 'Eat Dinner', '' ]
} );
});
var tasks = [ 'Create Node.js App', 'Eat Dinner' ];
app.all( '/tasks', function( req, res ){
// If the form was submitted..
if( req.body.tasks ) {
// ..use tasks from the form
tasks = req.body.tasks.filter( function( val ) { return val; } );
}
// Create an empty task
tasks.push( '' );
// Render 'index.ejs' using the up-to-date task list
res.render( 'index', {
tasks: tasks
} );
});
app.use(express.static('./public'));
No comments:
Post a Comment