I was trying to send more then one FORM, but I get an error.
The first FORM works the second one doesn't. It's the same form.
The second one gives me an error Cannot POST /ha
<body>
<form action="/ha" method="post">
<input type="text" name="user">
<input type="submit" value="Senden">
</form>
<form action="/Gehalt" method="post">
<input type="text" name="user">
<input type="submit" value="Senden">
</form>
</body>
this is my test.js
const sqlite3 = require('sqlite3').verbose();
const express = require('express');
const bodyParser = require('body-parser')
var app = express();
let Gehalt
let r
app.use(bodyParser.urlencoded({
extended: true
}));
let db = new sqlite3.Database('memory.sqlight3', sqlite3.OPEN_READWRITE, (err) => {
if (err) {
console.error(err.message);
}
console.log('Connected to the chinook database.');
});
app.get('/', function(req, res) {
res.sendFile(__dirname + '/test.html');
});
app.post('/ha', function(req, res) {
console.log("Yout got it");
r = req.body.user;
var stmt = db.prepare('INSERT INTO lorem (Salary) VALUES(?);');
stmt.run(r);
stmt.finalize();
db.close();
});
app.post('/Gehalt', function(req, res) {
console.log("Yout got it");
r = req.body.user;
var stmt = db.prepare('INSERT INTO lorem (Outgoings) VALUES(?);');
stmt.run(r);
stmt.finalize();
db.close();
});
app.listen(3100, function() {
console.log('GO to Port 3100');
});
What did I do wrong?
Related
I'm try to post From HTML Form To MongoDB Atlas and following the tutorial.
used:
express js
body-parser
mongoose
I can create a request but no content.
I have no clue where's the problem.
I'm supposed to show the document in MongoDB Atlas
{
"_id": "a13d1s2bc12as3a2",
"name": "Name",
"password": "password",
"_v": 0
}
but now like this:
{
"_id": "a13d1s2bc12as3a2",
"_v": 0
}
I can connect the mongoDB.
Here my code:
const express = require("express");
const app = express();
const mongoose = require("mongoose");
const bodyParser = require("body-parser");
const urlencoded = require("body-parser/lib/types/urlencoded");
app.use(bodyParser.urlencoded({extended: true}));
//connect mongodb
mongoose.connect("mongodb+srv://comp3421:password#cluster.o06sg.mongodb.net/db", {useNewUrlParser: true, useUnifiedTopology: true})
//create dataSchema
const notesSchema = {
username:String,
password:String
}
const Note = mongoose.model("Note", notesSchema);
//get function
app.get("/", function(req, res){
res.sendFile(__dirname + "/try.html");
})
//insert into mongodb
app.post("/", function(req, res){
let newNote = new Note({
username: req.body.username,
password: req.body.password
});
newNote.save();
res.redirect('/');
})
app.listen(3000, function(){
console.log("server is running on 3000")
})
This part is try.html and the main part of the html:
<form action="/" method="post" enctype="multipart/form-data">
<div class="f input">
<label>Username</label>
<input type="text" name="username">
</div>
<div class="f input">
<label>Password</label>
<input type="password" name="password" >
</div>
<div>
<input type="submit" value="Create account">
</div>
</form>
You need to parse request body.
You have to mention below line.
app.use(bodyParser.json());
This enctype="multipart/form-data" blocking me from sending my data to mysql but it is a must for multer to work. I'm trying to store the image filename to database while the file will store to my project directory ./uploads using multer framework. I've tried different queries but nothing happen. I'm hoping for you guys which have faced the same issue like mine please take a little of your time. Thank you in advance.
<form class="add-music-form" action="/save" method="POST" enctype="multipart/form-data">
<div class="form-group">
<div class="song-feaured-image">
<input style="display: none;" type="file" accept="image/*" id="file" name="featured_img" onchange="loadFile(event)" required>
<img id="output" class="image-preview" width="130" src="/img/rock-on.jpg" />
<label for="file" class="attach_file" style="cursor: pointer">
<i class="material-icons">attach_file</i></label>
</div>
</div>
<div class="form-group">
<input type="text" class="form-control" placeholder="Title" id="title" name="title" required>
</div>
<div class="form-group">
<input type="text" class="form-control" placeholder="Band name" id="band_name" name="band_name" required>
</div>
<div class="custom-file">
<input type="file" class="custom-file-input" id="customFile" name="audio" required>
<label class="custom-file-label" for="customFile">Select audio file</label>
</div>
<div class="mt-3">
<button type="submit" class="btn btn-primary">Submit</button>
<a onclick="cancel()" class="btn btn-default">Cancel</a>
</div>
</form>
app.js
const path = require('path');
const express = require('express');
const multer = require('multer');
const ejs = require('ejs');
const bodyParser = require('body-parser');
const mysql = require('mysql');
const app = express();
const DIR = './assets/uploads/featured-img';
// Set The Storage Engine
let storage = multer.diskStorage({
destination: function (req, file, callback) {
callback(null, DIR);
},
filename: function (req, file, cb) {
cb(null, file.fieldname + '-' + Date.now() + path.extname(file.originalname));
}
});
let upload = multer({storage: storage});
// Set Database Connection
const connection=mysql.createConnection({
host:'localhost',
user:'root',
password:'',
database:'nodejs_crud'
});
connection.connect(function(error){
if(!!error) console.log(error);
else console.log('Database Connected!')
});
//set view file
app.use(express.static('assets'));
app.use(express.static(__dirname + '/assets'));
//set view engine
app.set('view engine', 'ejs');
app.use(bodyParser.json());
// app.use(express.urlencoded({ extended: true }));
app.use(bodyParser.urlencoded({ extend: false}));
app.get('/',(req, res) => {
let sql = "SELECT * FROM music"
let query = connection.query(sql, (err, rows) => {
if(err) throw err;
res.render('music_index');
});
});
app.get('/', (req, res) => res.render('music_index'));
app.post('/save',upload.single('featured_img'), function (req, res) {
let sql = "INSERT INTO `music`(`featured_img`, `title`, `band_name`, `audio`) VALUES ('" + req.body.featured_img + "', '"+req.body.title+"', '"+req.body.band_name+"', '"+req.body.audio+"')";
let query = connection.query(sql, (err, results) => {
if(err) throw err;
res.redirect('/');
});
});
// Server Listening
const port = 3000;
app.listen(port, () => console.log(`Server started on port ${port}`));
suggestion
reference this
your data that inserted into database isn't on req.body object instead some where else.
like req.files.file object. you can print out the log by using console.log('req.file' + req.file + 'req.files' + req.files) on your app.js file
app.post('/save',upload.single('featured_img'), function (req, res) {
console.log('req.file' + req.file + 'req.files' + req.files)
let sql = "INSERT INTO `music`(`featured_img`, `title`, `band_name`, `audio`) VALUES ('" + req.body.featured_img + "', '"+req.body.title+"', '"+req.body.band_name+"', '"+req.body.audio+"')";
let query = connection.query(sql, (err, results) => {
if(err) throw err;
res.redirect('/');
});
});
reference
I am trying to get my node js to return and output the value taken from a Html form.
The node.js file is as follows
const app = express();
var path = require('path');
var fs = require('fs');
app.get('/', (req, res) => {
res.sendFile(path.join(__dirname + '/index.html'));
});
app.post('/myform', function(req, res) {
var myText = req.query.mytext;
res.send('Your Text:' +myText);
fs.writeFile('app.py',myText,function(err) {
if(err) throw err;
});
});
app.listen(3000, () => console.log('listening on port 3000!'));
The HTML is
<!DOCTYPE html>
<html>
<body>
<h1 style="color:Blue">Docker</h1>
<div id="floating-panel">
<form action="/myform" method="post">
<input type="text" name="mytext" required />
<input type ="submit" value="Submit">
</form>
</div>
</body>
</html>
when I fill out the form I get the Output "Your Text:undefined" , why isnt myText variable being updated?
req.query.mytext is wrong.
req.query use when you want to extract query string.
I think here you need to use req. body, Please replace your code with following code
const app = express();
const path = require('path');
const fs = require('fs');
const bodyParser = require('body-parser');
app.use(bodyParser.urlencoded({
extended: true
}));
app.use(bodyParser.json());
app.get('/', (req, res) => {
res.sendFile(path.join(__dirname + '/index.html'));
});
app.post('/myform', function(req, res) {
const myText = req.body.mytext;
res.send('Your Text:' +myText);
fs.writeFile('app.py',myText,function(err) {
if(err) throw err;
});
});
app.listen(3000, () => console.log('listening on port 3000!'));
This is what you need to do:
index.js
var express = require('express');
const app = express();
var path = require('path');
var fs = require('fs');
const bodyParser = require('body-parser');
app.use(bodyParser.urlencoded({ extended: true }));
app.get('/', (req, res) => {
res.sendFile(path.join(__dirname + '/index.html'));
});
app.post('/myform', function(req, res) {
var myText = req.body.mytext;
res.send('Your Text:' +myText);
fs.writeFile('app.py',myText,function(err) {
if(err) throw err;
});
});
app.listen(3000, () => console.log('listening on port 3000!'));
the code below is pretty messy so don't judge too much! I am trying to POST a basic user profile into my database, i don't think i am far off but i keep getting a 404.
im pretty knew to all of these technologies so could somebody please enlighten me as to what i have done wrong.
node.js POST method
var express = require('express');
var router = express.Router();
var mongo = require('mongodb');
var assert = require('assert');
var url = 'mongodb://localhost:27017/local';
/* GET home page. */
router.get('/', function(req, res, next) {
res.render('signIn', { title: 'signIn' });
});
router.get('/getData', function(req, res, next){
mongo.connect(url, function (err, db) {
assert.equal(null, error);
var cursor = db.collection('userData').find();
cursor.forEach(function(doc, err){
assert.equal(null, err);
resultArray.push(doc);
}, function() {
db.close();
res.render('index', {items: resultArray});
} );
});
});
router.post ('/insert', function(req,res,next) {
var item = {
email: req.body.email,
firstName: req.body.firstName,
lastName: req.body.lastName,
password: req.body.password
};
mongo.connect(url, function (err, db) {
assert.equal(null, err);
db.collection('userData').insertOne(item, function (err, result) {
assert.equal(null, err);
console.log('item has been inserted');
db.close;
});
});
res.redirect('/');
});
module.exports = router;
form HTML
<!DOCTYPE html>
<html lang="en">
<head>
<title>SignIn Page</title>
<link rel="stylesheet" type="text/css" href="/stylesheets/signIn.css"/>
</head>
<body>
<div class="background">
<div class="loginFormWrapper">
<form action="/users/submit" method="POST">
<div class="loginForm">
<label for="firstName">First name:</label>
<input type="text" class="form-control" id="firstName" name="firstName" placeholder="first name">
<label for="lastName">Last name:</label>
<input type="text" class="form-control" id="lastName" name="lastName" placeholder="last name">
<label for="email">Email address:</label>
<input type="email" class="form-control" name="email" id="email" placeholder="email">
</div>
<div class="form-group">
<label for="pwd">Password:</label>
<input type="password" class="form-control" name="password" id="password" placeholder="password">
</div>
<div class="checkbox">
<label><input type="checkbox"> Remember me</label>
</div>
<button type="submit" class="btn btn-default">Submit</button>
</form>
<form action="users" method="GET">
<button type="submit" class="btn btn-default">get result</button>
</form>
</div>
</div>
</body>
</html>
App.js
var express = require('express');
var path = require('path');
var favicon = require('serve-favicon');
var logger = require('morgan');
var cookieParser = require('cookie-parser');
var bodyParser = require('body-parser');
var validate = require('form-validate');
var mongoose = require('mongoose');
var index = require('./routes/index');
var users = require('./routes/users');
var About = require('./routes/about');
var signIn = require('./routes/signIn');
var contact = require('./routes/contact');
var app = express();
// view engine setup
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'ejs');
// uncomment after placing your favicon in /public
//app.use(favicon(path.join(__dirname, 'public', 'favicon.ico')));
app.use(logger('dev'));
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: true }));
app.use(bodyParser.json());
app.use(cookieParser());
app.use(express.static(path.join(__dirname, 'public')));
app.use('/', index);
app.use('/users', users);
app.use('/About', About);
app.use('/signIn', signIn);
// app.use('/contact', contact);
//catch 404 and forward to error handler
app.use(function(req, res, next) {
var err = new Error('Not Found');
err.status = 404;
next(err);
});
// error handler
app.use(function(err, req, res, next) {
// set locals, only providing error in development
res.locals.message = err.message;
res.locals.error = req.app.get('env') === 'development' ? err : {};
// render the error page
res.status(err.status || 500);
res.render('error');
});
module.exports = app;
user.js
var express = require('express');
var app = require("mongoose");
var router = express.Router();
/* GET users listing. */
router.get('/', function(req, res, next) {
res.send('respond with a resource');
});
module.exports = router;
A quick reminder, the post() method just gets the data from the <form> you specify. For you to be able to get that data you'd have to do something like this.
app.js
const express = require('express)
const mongoose = require('mongoose)
var app = express()
mongoose.connect('mongodb://localhost:"yourPortHere"/"mongoDBhere"')
Now post needs the body parser in order to be able to retrieve the data and sort of "translate it" to JS, for that you need the body parser.
app.use(bodyParser.urlencoded({extended: false})) //Post Body Parser
Now let's get to the post
app.post("/action", (req, res) => {
var userData = {
username: req.body.username,
password: req.body.password
}
For the moment userData is going to hold the data you just retrieved from the <form>
Remember that action="/YourActionHere is the identifier for the app.post("/YourActionHere") so those two have to match, otherwise you will not get the data.
To save it to MongoDB you first need to create a model of the object you want to store, if MongoDB has a Database named movies with a directory named films on it you first have to create a Model named film since mongoose will save it in the directory films (<- By directory I mean collection)
So: in folder Models you create a model of the object
const mongoose = require('mongoose')
const Schema = mongoose.Schema
var film = new Schema({
title: String,
year: String,
director: String
})
module.exports = mongoose.model("movie", movieSchema)
To be able to use that new Schema you have to import it in you app.js with
var Film = require('pathToFilmSchema')
Now in your post you will save userData to that Schema, and mongoose will store it in the collection specified in its .js.
app.post("/action", (req, res) => {
var userData = {
title: req.body."name",
year: req.body."name",
director: req.body.""
}
new Film(userData)
})
If the structure is the same de Data in that variable will be stored in a Schema, then you just have to call the method .save(), which you can call right after like this
newFil(userData)
.save()
Now mongoose will store a new object with film Schema into the database you have connected at the top. Keep in mind that, if you don't have a collection named film mongoDB will create one collection named films (the plural, always) and store the Schema there.
After saving you can res.redirect() to "/" or render another page, that's up to you.
You have posted to url users/submit but i don't see any API for users/submit . You have said to use users for /users urls but have you defined the /submit within /users?
You could go through this
Routing in expressjs
Inside your app.post function you should have something like this:
let MongoClient = require('mongodb').MongoClient;
let connectionUrl = "mongodb://localhost:27017/";
// or
// let connectionUrl = "mongodb+srv://<username>:<password>#<your-cluster-url>/test?retryWrites=true&w=majority";
// creating the message object
let obj = {"text" : "Something"};
console.log("OBJ: " + obj);
MongoClient.connect(connectionUrl, function(err, client) {
if (err) throw err;
console.log("Connected correctly to server");
// if database and collection do not exist they are created
var db = client.db('YourDatabase')
db.collection("YourCollection").insertOne(obj, function(err, res) {
if (err) throw err;
console.log("1 message inserted");
client.close();
});
});
I have an html file (home.html) and a node.js file (app.js).I used mysql also.What i have now is the app.js that is the server side that looks like this:
var application_root = __dirname,
express = require("express"),
mysql = require('mysql');
path = require("path");
var app = express();
var http = require('http');
var connection = mysql.createConnection({host : '127.0.0.1',user : 'root', password : '',database: "medical"
});
app.configure(function () {
app.use(express.bodyParser());
app.use(express.methodOverride());
app.use(app.router);
app.use(express.static(path.join(application_root, "public")));
app.use(express.errorHandler({ dumpExceptions: true, showStack: true }));
});
app.get('/getallusers/:email', function (req, res) {
connection.connect();
//var json = '';
connection.query('SELECT * FROM users where email = '+req.params.email, function (error, rows, fields) {
str='';
for(i=0;i<rows.length;i++)
str = str + rows[i].email +'\n';
// res.end( str);
res.end( str);
// json = JSON.stringify(rows); //displaying json file
//res.send(json);
});
connection.end();
});
And in my home.html i have a text box and a button that represents a search action to do that retrieves data from the database :
<div class="search" id = "page_content1">
<h1>Enter Candidate's email: </h1>
</br>
<form method="get" action="http://127.0.0.1:1212/getallusers/email">
<input type="text" name="email" id="email">
<input type="submit" name="commit" value="search" id = "search" onclick="display()"/>
</form>
</div>
Now I want to have the results retrieved by the query in app.js file to be displayed in my home.html file,any help on how to do that?