在视图引擎上实现前端 js 代码的问题答案

【问题标题】：issues with implementing front end js code on view engine在视图引擎上实现前端 js 代码的问题
【发布时间】：2020-05-12 03:55:07
【问题描述】：

所以我目前正在为这个基于 Web 的应用程序开发这个表单验证部分。尝试在ejs文件上应用一些前端js代码如下图，

<body>
    <h1>Doctor</h1>
    <p>Registration</p>
    <!--physician route-->
    <div id="doc_reg">
        <form method='POST'onsubmit="return formValidation()"action="/physician/loggedin">
            <label>Username:</label>
            <input type="text" id="user_name" name="user_name">
            <label>Email:</label>
            <input type="email" id="user_email" name="user_email">
            <label>Type in First Name:</label>
            <input type="text" id="first_name" name="first_name">
            <label>Type in Last Name:</label>
            <input type="text" id="last_name" name="last_name">
            <label>Create your password:</label>
            <input type="text" id='password_1' name='password_1'>
            <label>Confirm your password:</label>
            <input type="text" id='password_2' name='password_2'>
            <button type="submit">Register</button>
        </form>
    </div>
    <script src="../../public/doclogin.js"></script>

</body>

</html>

我这里尝试实现的js代码（为了交流方便而简单化了）

function formValidation(){
    const user_name = document.getElementById('user_name').value
    const user_email = document.getElementById('user_email').value
    const first_name = document.getElementById('first_name').value
    const last_name = document.getElementById('last_name').value
    const password_1 = document.getElementById('password_1').value
    const password_2 = document.getElementById('password_2').value

    //we will leave the creating password part later, because it is such a pain in the ass

    if (user_name==="" || user_email==="" || first_name==="" || last_name===""|| password_1===""|| password_2===""){
        alert("Information Missing for Required Entries")
        return false
    }
}

我不知道为什么验证不能按预期方式工作。但是，当我使用相同的 js 代码在 纯 html 文件 上制作表单时，它可以工作。为什么会这样？？

【问题讨论】：

标签： javascript model-view-controller ejs

【解决方案1】：

使用 && 检查所有必填字段

【讨论】：

我很确定它应该是输入之间的“或”关系而不是“和”。如果您说只有一个输入字段为空而所有其他字段都已填写，则提交将不会通过

【解决方案2】：

这个问题的答案可以在这里How to include external .js file to ejs Node template page找到。

【讨论】：