FORM SUBMIT WITH BOOTSTRAP AND NODEJS
7 min
Jun 13 2019
Here is provided a simple code sample of how to place bootstrap form on your site and connect it with node js server.
//connect express
var express = require('express');
var path = require('path');
var ejs = require('ejs');
var partials = require('express-partials');
var app = express();

app.use(express.json());
app.use(partials());
app.use(express.urlencoded({ extended: false }));
app.set('views', path.join(__dirname, '../views'));
app.set('view engine', 'ejs');

//top level routing
app.get('/', (req, res) => {
    res.render('index.ejs')
});

app.post('/submit_form', function(req, res){
    res.render('thanks.ejs', {body: req.body})
});


//start server
var http = require('http');

var port = 3000;
app.set('port', port);

var server = http.createServer(app);

server.listen(port);
<- start index.ejs -->
<form action="/submit_form" method="post" class="form-signin">
  <div class="form-group">
    <label for="email">Email</label>
    <input type="text" class="form-control" name="email" placeholder="Enter email">
  </div>
  <div class="form-group">
    <label for="name">Message</label>
    <textarea type="text" class="form-control" name="message" placeholder="Enter message"></textarea>
  </div>
  <button type="submit" class="btn btn-primary">Submit</button>
</form>
<- end index.ejs -->

<- start thanks.ejs--->
<%=JSON.stringify(body)%>
<end thanks.ejs --->
<- start layout.ejs --->
<html>
<head>
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">
</head>
<body>
<div class="container">
    <div class="content">
        <%-body -%>
    </div>
</div>
</body>
</html>
<- end layout.ejs --->
BLOG LATEST
Popular articles
GOT AN IDEA? LET'S DISCUSS!
Share your project’s scope, timeline, technical requirements, business challenges, and other details you consider necessary. Our team will study them and contact you soon. Let’s make an exciting product together!
By sending this form I confirm that I have read and accept the Privacy Policy
WELCOME TO OUR OFFICES
Georgia
Russia