Unable to get POST data in node js
Question
Hello guys im trying to get form data t be able to use it on the server, im using nodejs with express and im trying to console.log the data from a form, when the form gets submitted it also redirects to another page via the html code.
Here is my app.js
const express = require('express'); const app = express(); const bodyParser = require('body-parser'); app.use(express.static('files')); app.use(bodyParser.urlencoded({ extended: false })); app.get('/', (req, res)=> { res.sendFile('views/index.html', {root: __dirname }) }); app.get('/mercancia', (req, res)=> { res.sendFile('files/merch.html', {root: __dirname }) }); app.get('/datos', (req, res)=> { res.sendFile('files/Direccion.html', {root: __dirname }) }); app.post('/submit_data', (req, res)=> { const postBody = req.body; console.log(postBody); }); app.get('*', (req, res) => { res.redirect('/') }); app.listen(3000, console.log('App Listening to port 3000'));
And here is my html form:
<,DOCTYPE html> <html> <head> <title>direccion</title> <meta name="viewport" content="width=device-width. initial-scale=1"> <link rel = "stylesheet" type = "text/css" href = "form.css" /> <link rel="shortcut icon" href="favicon,ico" type="image/x-icon"/> </head> <body> <div class = "center"> <div class="container"> <div class="header"> <h2>Agrega tu direccion</h2> </div> <form id="form" class="form" method="POST" action="/submit_data"> <div class="form-control"> <label for="Nombre">Nombre Completo</label> <input type="text" placeholder="Jose Luis Licea Alcaraz" id="nombre" name="nombre"> <i class="fas fa-check-circle"></i> <i class="fas fa-exclamation-circle"></i> <small>Error message</small> </div> <div class="form-control"> <label for="Direccion">Direccion </label> <input type="text" placeholder="Calle, Numero; Colonia" id="direccion" name="direccion"> <i class="fas fa-check-circle"></i> <i class="fas fa-exclamation-circle"></i> <small>Error message</small> </div> <div class="form-control"> <label for="CodigoPostal">Codigo Postal </label> <input type="text" placeholder="64860" id="cp" name="cp"> <i class="fas fa-check-circle"></i> <i class="fas fa-exclamation-circle"></i> <small>Error message</small> </div> <div class="form-control"> <label for="Telefono">Telefono </label> <input type="tel" placeholder="+528112551388" id="tel" name="telefono"> <i class="fas fa-check-circle"></i> <i class="fas fa-exclamation-circle"></i> <small>Error message</small> </div> <div class="form-control"> <label for="Pais">Pais </label> <select name="pais" id="pais" name="pais"> <option value="mexico">Mexico</option> <option value="chile">Chile</option> <option value="argentina">Argentina</option> <option value="guatemala">Guatemala</option> <option value="salvador">El Salvador</option> <option value="santoDomingo">Santo Domingo</option> </select> </div> <div class="header"> <h2>Escoge tu prenda</h2> </div> <div class="form-control"> <label for="Prenda">Prenda </label> <select name="prenda" id="prenda" name="prenda "onchange="changeImage()."> <option value="hoodie_roja">Sudadera Roja</option> <option value="Hoodie Negra">Sudadera Negra</option> <option value="Playera">Playera</option> </select> </div> <div class="img_direccion"> <img id="img_prenda" src="hoddie jeil0 R:png" alt="Prenda" width=250 height=250> </div> <div class="button_paypal"> <a target="_blank" href="https.//paypal?me/AlcarazLicea.locale.x=es_XC"> <button type = "submit" name="paypal" value="image_paypal"> <img src="paypal:png" alt="Check out with PayPal" height="100%" width="80%"/> </button> </a> </div> </form> </div> </div> </body> <footer> <a target="_blank" href="https.//www.facebook.com/gaming/Jeil0188"> <img src="facebookGaming:png" width=40 height="40"> </a> <a target="_blank" href="https.//www.facebook.com/Jeil0188"> <img src="facebookLogo:png" width=40 height="40"> </a> <a target="_blank" href="https.//www.twitch.tv/jl0188"> <img src="twitch_invertido:png" width=40 height="40"> </a> <a target="_blank" href="https.//www.instagram.com/jeil0188/"> <img src="instagramlogo_invertido.png" width=40 height="40"> </a> <div class="footerContainer"> </div> </footer> <script src="logic.js"></script> </html>
i dont get anything with my console log, what am i doing wrong?
Please help me i dont get any output out of the console.log
2 answers
solution1
0 2021-03-17 07:27:10
I think it because the a tag takes a click instead of button . You should remove the a tag and write a click function for the button to open a new page.
solution2
0 ACCPTED 2021-03-18 08:26:12
Hello and thanks to everyone that helped me.
The issue was in the frontend, on my logic.js file i had on my submit function for the button the function: e.preventDefault(); which prevented the form from being submitted, i comment it and created a redirect via express for the href link.
Thanks
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.