I want to pull data from Mongodb and display it on my web page. To create a button, press this button and the data should appear on the screen.
html :
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css"
integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
</head>
<style>
.democlass {
display: block;
width: 100%;
height: 34px;
padding: 6px 12px;
font-size: 14px;
line-height: 1.42857143;
color: #555;
background-color: #fff;
background-image: none;
border: 1px solid #ccc;
border-radius: 4px;
margin-top: 10px;
margin-bottom: 10px;
}
</style>
<body>
<h1>Posting data to mongo</h1>
<form class="containter" id="container" method="post" action="/">
<div id="divInputs">
<div class="form-group">
<input class="form-control" name="title" id="title1">
</div>
<div class="form-group">
<input class="form-control" name="content" id="title2">
</div>
</div>
<button>add mobgodb</button>
</form>
<button type="button" id="btnCreateInput">Yeni Input</button>
<button type="button" value="Result" onclick="getData()">getData</button>
<form class="containter" method="post" action="/">
</form>
<div>
{% for doc in details %}
<p>{{doc['allSentences']}}</p>
<p>{{doc['time']}}</p>
{% endfor %}
</div>
<script>
let inputCount = 0;
const divInputs = document.getElementById('divInputs');
document.getElementById('btnCreateInput').addEventListener("click", function () {
inputCount++;
const newInput = document.createElement('input');
newInput.type = "text";
newInput.id = "input" + inputCount;
newInput.className = "form-control";
newInput.name = "text" + inputCount;
const newDiv = document.createElement('div');
newDiv.id = "div" + inputCount;
newDiv.className = "form-group";
newDiv.appendChild(newInput);
divInputs.appendChild(newDiv);
})
</script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/browser.min.js"></script>
<script src="server.js"></script>
</body>
</html>
js:
const express = require('express');
const mongoose = require('mongoose');
const app = express();
const ejs = require('ejs');
app.set('view engine', 'ejs');
const bodyParser = require("body-parser");
app.use(bodyParser.urlencoded({ extended: true }))
const url = "url";
mongoose.connect(url, { useNewUrlParser: true, useUnifiedTopology: true })
.then((result) => console.log("Basarili"))
.catch((err) => console.log(err))
const notesSchema = {
text1: String,
text2: String,
text3: String,
text4: String,
text5: String,
text6: String,
text7: String,
text8: String,
text9: String,
text10: String,
text11: String,
text12: String,
text13: String,
text14: String,
text15: String,
}
const resultsSchema = {
allSentence: String,
time: Number
}
const Result = mongoose.model("Result", resultsSchema);
const Note = mongoose.model("Note", notesSchema);
async function getItems(){
const Items = await Result.find({}).sort({_id:-1}).limit(1);
return Items;
}
app.get("/", function (req, res) {
getItems().then(function(FoundItems){
res.render('index', {resultsList: FoundItems});
});
})
app.post("/", function(req, res) {
let newNote = new Note({
text1: req.body.title,
text2: req.body.content,
text3: req.body.text1,
text4: req.body.text2,
text5: req.body.text3,
text6: req.body.text4,
text7: req.body.text5,
text8: req.body.text6,
text9: req.body.text7,
text10: req.body.text8,
text11: req.body.text9,
text12: req.body.text10,
text13: req.body.text11,
text14: req.body.text12,
text15: req.body.text13,
});
newNote.save();
res.redirect('/');
})
app.listen(5500, function(){
console.log("server is running on 5500");
})
var cumle = "";
async function getData(){
try {
const post = await Result.find({}).sort({_id:-1}).limit(1);
console.log(post);
} catch (error) {
console.log(error.message);
}
}
function display() {
alert("Hello world!");
}
getData();
Despite trying many methods, I can’t get any results. Can you help me ?
I create a ejs file and this file moved to view is not working to or i cant do it.