使用MongoDB的和Node.js的处理多种形式的一页(Processing multiple f

2019-10-20 05:25发布

我有我的登记表都在同一个登录页面。 我已经指定了两个不同的路线张贴的数据,但它可以节省登入形式输入(这是没有的)时,我打登记按钮在登记表的末尾? 我看了看这个问题( 多种形式和一个处理页面 )。 它是如何将与节点的工作,是否会意味着我必须建立不同形式的模块?

这里是我的代码。 我在最后也有一个小的脚本,因为我的引导模板的滑块功能与提交功能发生冲突。

<h2>Register<h2>
<form method="POST" action="/samples"> 
    <input type="text" name="fullName" id="fullName" class="input-lg " placeholder="your full name" data-required="true">
    <input type="text" name="age" id="age" class="input-lg" placeholder="age">
    <input type="text" name="city" id="city" class="input-lg" placeholder="Your City"> 
    <input type="text" name="job" class="input-lg" placeholder="Your Job">
    <input type="text" name="username" class="input-lg " placeholder="prefered username" data-required="true">
    <input type="password" name="password" class="input-lg" placeholder="Password">
    <input type="email" name="email" class="input-lg " placeholder="your email" data-required="true">
    <button type="submit" class="btn btn-primary">Sign in</button>
</form>

<h2>Login!</h2>
<form method="POST" action="/dashboard">
    <hr class="colorgraph">
    <input type="email" name="emaillog" class="input-lg " placeholder="your email" data-required="true">
    <input type="password" name="passwordlog" class="input-lg" placeholder="Password">
    <button type="submit" class="btn btn-primary">Sign in</button>
</form>

<script>
    $('button').click( function() {
        $('form').submit();
    });
</script>

谢谢你的帮助

Answer 1:

嗯,首先因为你有两种形式,您必须指定要点击一个按钮提交的表单。 眼下任何按钮点击将只提交第一种形式。 给第一种形式的提交按钮类registerButton和第二表单提交类loginButton 。 我还建议让类的形式。 一会registerForm ,另一种是loginForm 。 然后改变你的HTML以反映更改

<form method="POST" action="/samples" class="registerForm"> 
...
<button type="submit" class="btn btn-primary registerButton">Sign in</button>
<form method="POST" action="/dashboard" class="loginForm">
...
<button type="submit" class="btn btn-primary loginButton">Log in</button>

然后你的JavaScript改成这样:

    $('button.registerButton').click( function() {
        $('form.registerForm').submit();
    });
    $('button.loginButton').click( function() {
        $('form.loginForm').submit();
    });

现在,您可以两种形式提交给两个不同的路线
一种形式会去取样 ,另一个仪表板 ,让您的服务器上(在节点),您可以检查一下是哪条路线。 我会建议使用节点框架之一与应用程序的工作。 你可以试试快车 。 这将大大简化与路线的工作。 它可以让你写的路线一样容易的:

app.post('/samples', function(req, res){
    // check register form
    // res.send('user' + req.body);
});
app.get('/dashboard', function(req, res){
    // check login form
    // res.send('user' + req.body);
});

你可以阅读更多关于快递从建议列表在这里 。



文章来源: Processing multiple forms in one page using Mongodb and node.js