点击表单中的按钮没有任何作用



这是一个使用NodeJS的试用登录界面。代码用于登录屏幕,但提交按钮没有做任何事情。这段代码缺少什么?这个按钮没有直接指向我创建的仪表盘屏幕。

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> <%=title%> </title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-GLhlTQ8iRABdZLl6O3oVMWSktQOp6b7In1Zl3/Jr59b6EGGoI1aFkw7cmDA6j6gD" crossorigin="anonymous">
<link rel="stylesheet" href="/static/style.css">
</head>
<body><h1> LMS</h1>
<form>
<div class="text-center center-div "id="login">
<div class="container w-25 py-5">
<div class="title pb-5">
<h2 class="font-weight-bold">Login System</h2>
<span> Login for the existing user</span>
</div>
<form action="/route/login" method="post" class="pt-3">
<div class="form-group">
<input type="email" class="form-control" id="exampleInputEmail1" name="email" placeholder="email">
<small class="form-text text-muted text-left">We'll never share your email with anyone else.</small>
</div>
<div class="form-group">
<input type="password" class="form-control" id="exampleInputPassword1" name="password" placeholder="password">
</div>

<button type="submit" class="btn btn-success rounded-pill">Submit</button>
</form>

</div>          
</div>



</form>

</body>
</html>

路由器JS

var express=require("express");
var router=express.Router();
const credentials={email:"rnwit@gmail.com",password:"Chennai@123"}
//login
router.post('/login',(req,res)=>{
if (req.body.email==credentials.email && req.body.password==credentials.password){
req.session.user=req.body.email;
res.redirect("/route/dashboard");
//res.end("login successs");
}else{
res.end("Imvalid username and password");
}
});
//dashboard
router.get('/dashboard',(req,res)=>{
if(req.session.user){
res.render('/dashboard',{user:req.session.user})
}else{
res.send('Unauthorised user')
}
})
module.exports=router;

应用JS

const express = require("express");
const path=require("path");
const bodyparser=require("body-parser");
const session=require("express-session");
const {v4:uuidv4}=require("uuid");
const router=require("./router");

const app = express();

const port=process.env.PORT ||8080;

app.use(bodyparser.json());
app.use(bodyparser.urlencoded({extended:true}));

app.set('view engine','ejs');

//LOAD STATIC ASSETS
app.use('/static',express.static(path.join(__dirname,'public')));
app.use('/assets',express.static(path.join(__dirname,'assets','images')));
app.use(session({
secret:uuidv4(),
resave:false,
saveUninitialized:true
}));
app.use('/route',router);
//ROUTE
app.get('/',(req,res)=>{
res.render('base',{'title':'Login System'})
})

app.listen(port,()=>{'Listening on port 3000'});

谁能检查一下,说这里缺少什么,为什么表单提交按钮不能工作?

正如Teemu所评论的,(不允许嵌套表单)。由于无效的HTML,浏览器会剥离内部表单,并在外部表单中包含所有表单元素,在您的情况下,外部表单没有action属性。- - - - - -Teemu)当我删除外部形式时,它工作了。由于

最新更新