[英]ejs file not rendering with res.render when I call the server side js method from client side js
I am new to node.js and trying to call an ejs file from server-side js.我是 node.js 的新手,并试图从服务器端 js 调用 ejs 文件。 I am calling both the post and get methods from the client js file.
我正在从客户端 js 文件中调用 post 和 get 方法。 Below is my code.
下面是我的代码。
Client-side js:客户端js:
function playerlist(){
const button = document.getElementById('playerselection');
//const data={selectedplayers:window.players};
button.addEventListener('click', function() {
console.log(players);
fetch('/FantasyTeam', {method: 'POST',
body: JSON.stringify(players),
headers: {'Content-Type':'application/json'},
})
.then(function(response) {
if(response.ok) {
CallGetMethod();
return;
}
throw new Error('Request failed.');
})
.catch(function(error) {
console.log(error);
});
});
}
function CallGetMethod(){
console.log('Inside CallGetMethod');
fetch('/FantasyTeam', {method: 'GET'})
.then(function(response) {
if(response.ok) {
console.log('Inside response');
return ;
}
throw new Error('Request failed.');
})
.catch(function(error) {
console.log(error);
});
}
**Server-side js:**
app.post('/FantasyTeam', (req, res) => {
const playerlist = req.body;
console.log(playerlist);
sql.connect(dbConfig, {
useNewUrlParser: true
}).then(() => {
// create Request object
console.log("Connected!");
var request = new sql.Request();
//Insert query to FantasyTeam Table with selected players.
request.query("INSERT Query").then(function (err, result)
{
console.log('record added to db');
}).catch(err => {
console.log('Could not insert the record to DB. Exiting now...', err);
process.exit();
});
}
res.sendStatus(201);
}).catch(err => {
console.log('Could not connect to the database. Exiting now...', err);
process.exit();
});
});
app.get('/FantasyTeam', (req, res) => {
// connect to your database
sql.connect(dbConfig, {
useNewUrlParser: true
}).then(() => {
// create Request object
var request = new sql.Request();
request.query("select query"), function (err, result)
{
console.log('records fetched from DB');
//res.send(result);
//res.render(path.resolve(__dirname + "/views/FantasyTeam"),{result});
res.render('FantasyTeam.ejs', { result });
//res.render('FantasyTeam.ejs', { result });
console.log(result.recordset.length);
});
}).catch(err => {
console.log('Could not connect to the database. Exiting now...', err);
process.exit();
});
}) ;
I tried multiple ways to render the FantasyTeam.ejs file.我尝试了多种方法来呈现 FantasyTeam.ejs 文件。 But couldn't succeed.There is no error in code, except that ejs file is not redered.
但是不能成功。代码没有错误,只是没有重新编写ejs文件。 Appreciate any help in this regard.
感谢这方面的任何帮助。
At first you have set view engine on your node application.首先,您在节点应用程序上设置了视图引擎。 Then second step create a views folder on the application root and then create a pages folder in views folder then create all template in your pages folder.
然后第二步在应用程序根目录上创建一个视图文件夹,然后在视图文件夹中创建一个页面文件夹,然后在页面文件夹中创建所有模板。 views folder needs to be static.
视图文件夹需要是静态的。 finally you can render template from pages folder in views directory.
最后,您可以从视图目录中的 pages 文件夹渲染模板。 See my example.
看我的例子。 For more information visit to ejs doc: https://ejs.co/#docs
有关更多信息,请访问 ejs 文档: https ://ejs.co/#docs
const express = require('express');
const app = express()
const router = express.Router()
// Setup View Engine and set static folder
app.use(express.static('public'))
app.set('view engine','ejs')
app.set('views','views')
//Controller
router.get('/example',(req,res,next)=>{
res.render('pages/index.ejs',{You Data})
})
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.