ajax - 来自 Node.js 的基本警报

Question

我有一个表单，用户可以在其中输入电子邮件、密码和类(class)。我使用以下命令从 node.js 向用户发送 HTML 文件:

app.get('/', function (req, res) {
    res.sendFile(path.join(__dirname + '/Login-Signup.html'));
});

我认为使用以下方式从表单中获取变量:

var email = req.body.email;
var password = req.body.password;
var cpassword = req.body.cpassword;
var userclass = req.body.userclass;

这就是我的 HTML 表单的设置方式:

<form method="post">
            <fieldset>
                <div class="formTitle">Account Sign Up</div>

                <label for="email">Email:</label>
                <input type="email" id="email" name="email" placeholder="Enter your email" />

                <label for="password">Password:</label>
                <input type="password" id="password" name="password" placeholder="Enter your password" />

                <label for="cpassword">Confirm Password:</label>
                <input type="password" id= "cpassword" name="cpassword" placeholder="Confirm password"/>

                <label for="class">Class:</label>
                <input id="text" id= "class" name="userclass" placeholder="Enter your class"/>

                <input type="submit" formmethod="post" formaction="/" value="Submit Details">

            </fieldset>
            </form>

输入值后，变量必须通过一些检查以查看它们是否有效。它们的布局如下:

app.post('/', function(req, res){
    function emailCheck(email){
        //when theres an error: console.log(error), and return false
    }

    function passCheck(password){
        //when theres an error: console.log(error), and return false
    }

    if (passCheck == true && emailCheck == true){
        //enter user into database
    }
}

当电子邮件或密码无效(根据我的检查)时，我希望出现一个警告框，显示问题。我研究过使用 AJAX，尝试了代码，但似乎没有什么对我有用。这是我从 HTML 中收集变量的方式吗？我的 get/post 命令是这样排列的吗？

提前致谢。

PS；我正在使用 express 。

Answer 1

我建议您使用Ajax(Jquery)post和res.send在前端获取结果:

前端:

        <fieldset>
            <div class="formTitle">Account Sign Up</div>

            <label for="email">Email:</label>
            <input type="email" id="email" name="email" placeholder="Enter your email" />

            <label for="password">Password:</label>
            <input type="password" id="password" name="password" placeholder="Enter your password" />

            <label for="cpassword">Confirm Password:</label>
            <input type="password" id= "cpassword" name="cpassword" placeholder="Confirm password"/>

            <label for="class">Class:</label>
            <input id="text" id= "class" name="userclass" placeholder="Enter your class"/>

            <input type="button" onclick="save();" value="Submit Details">

        </fieldset>

JQuery Ajax:

function save(){
  var data = {};
  data.email = document.getElementById("email");
  data.password = document.getElementById("password");
  $.ajax({
    type: 'POST',
    data: JSON.stringify(data),
    cache: false,
    contentType: 'application/json',
    datatype: "json",
    url: '/',
    success: function(returns){
        if (returns) 
            alert("User save");
        else
            alert("Error: user not save");
    }
  });

Node.js:

app.post('/', function(req, res){
    function emailCheck(email){
        //when theres an error: console.log(error), and return false
    }

    function passCheck(password){
        //when theres an error: console.log(error), and return false
    }

    if (passCheck == true && emailCheck == true){
        res.send(true); // if ok. You can get the res.send in the success ajax event.
    }
}

删除表单并通过javascript获取值。