Javascript/Node/EJS 中 post 的多个提交按钮

Question

所以我正在学习 Javascript 我正在练习的其中一件事是某种模型视图控制器。现在我有一个包含多个 ejs 模板的表单，但只有第一个与这个问题有关。

第一个是Home.ejs

<DOCTYPE html>
    <html>
        <head>
            <title> HomeTitle </title>
            <style>

                body{background: skyblue;}

            </style>
            <body>
                <p> Welcome Home</p>
                <div>
                    
                 <form id ="redirect" method="POST">
                      <input type="submit"value="SignIn" >
                      <input type="submit" value="Exit" >
                    </form>
            </body>
            <script>
            </script>
            
        </head>
    </html>

我还有一个 router.js 作为路由器文件处理。

// Importing the module
const express=require("express")
var bodyParser=require('body-parser')
  
// Creating express Router
const router=express.Router()
var jsonParser= bodyParser.json()
var urlencodedParser =bodyParser.urlencoded({extended: false});
// Handling login request
router.get("/",(req,res,next)=>{
  res.render('home.ejs')
})


router.post("/", urlencodedParser, function (req,res){
  return res.redirect("/login");
})

router.get("/login",(req,res,next)=>{
  res.render("profile.ejs")
})


router.post("/login", urlencodedParser, function (req,res){

  console.log(req.body)
  //res.send(req.body.first)
  return res.redirect('/');

})
module.exports=router

在我的 Home.ejs 中，我有两个提交按钮，一个用于登录，一个用于退出。目前，按任一按钮都会将我带到登录页面 (profile.ejs) 我正在渲染（b/c 只有一个渲染目标）。有没有办法让我区分在 javscript 部分按下了哪个按钮，以便我可以选择要呈现的页面。例如按下登录按钮将呈现一个 ejs 模板，而退出将转到我将呈现的另一个模板。

第一个 router.post 是 post 函数，理想情况下，区分的解决方案应该是因为这是我根据 post 数据处理渲染新页面的地方。

Answer 1

您可以为您的输入指定一个名称：

<input type="submit" value="SignIn" name="submit">
<input type="submit" value="Exit" name="submit">

然后根据该值检查提交的输入值和render/redirect：

const submit = req.body.submit;
if(submit === "SignIn"){
  //Do something
} else if(submit === "Exit"){
  //Do Something
} else {
}

Javascript/Node/EJS 中 post 的多个提交按钮

Multiple submit buttons for post in Javascript/Node/EJS

html

javascript

ejs

node.js