Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/364.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181

Warning: file_get_contents(/data/phpspider/zhask/data//catemap/3/html/89.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 如何在EJS模板中的表单Post请求之前显示确认对话框_Javascript_Html_Node.js_Forms_Ejs - Fatal编程技术网

Javascript 如何在EJS模板中的表单Post请求之前显示确认对话框

Javascript 如何在EJS模板中的表单Post请求之前显示确认对话框,javascript,html,node.js,forms,ejs,Javascript,Html,Node.js,Forms,Ejs,我正试图在EJS表单中创建一个类似这样的确认对话框:confirm('you sure?'),但我不知道在哪里以及如何让它正常工作 以下是迄今为止我的EJS模板的代码: <div id="popupAddUser" class="addUser"> <div class="card h-100"> <div class="row">

我正试图在EJS表单中创建一个类似这样的确认对话框:
confirm('you sure?')
,但我不知道在哪里以及如何让它正常工作

以下是迄今为止我的EJS模板的代码:

<div id="popupAddUser" class="addUser">
    <div class="card h-100">
        <div class="row">
            <div class="col-7"><h2>Create New User</h2></div>
        </div>
        <div class="card-body">
            <form method="POST" id="formAddUser" action="/add-user" enctype="multipart/form-data">
                <div class="container">
                    <div class="row">
                        <div class="col-xl-5 float-right">
                            <div class="form-group">
                                <input class="form-control" type="text" placeholder="Type a User name"
                                       name="create_user">
                            </div>
                            <div>
                                <button type="submit" class="btn btn-primary float-right" form="formAddUser" onclick="checker()">Create
                                    User
                                </button>
                            </div>
                        </div>
                    </div>
                </div>
            </form>
        </div>
    </div>
</div>

<script>
    function checker(){
        if( confirm("Are you sure you want to create a new User in the database?")){
            continue;
        }else{
            break;
        }   
    }
</script>


创建新用户
创造
使用者
函数检查器(){
如果(确认(“您确定要在数据库中创建新用户吗?”){
继续;
}否则{
打破
}   
}

我知道checker()函数的位置不正确,甚至没有必要,但我不确定是否有其他方法可以做到这一点。当我单击“创建用户”按钮时,确认对话框将呈现并询问我是否确实要创建用户。如果我选择yes,它应该提交表单,但如果我单击cancel,它不应该执行表单post请求

您可以使用JavaScript
submit()
函数根据响应远程提交表单。这意味着,您必须使用普通按钮,而不是使用提交按钮

函数检查器(){
如果(窗口确认(“您确定”)){
document.getElementById(“FormadUser”).submit();
}否则{
返回;
}
}

创建新用户
创造
使用者

我很惊讶您的文本编辑器没有抱怨if-else语句中的continue和break语句!! 我想:

  • 删除内联onclick事件处理程序

  • 改为使用addEventListener()方法或对表单元素的onsubmit调用

  • 单击“取消”按钮时,使用event.preventDefault()方法停止表单提交

    document.getElementById('form').addEventListener(
     'submit', 
     (e) => checker(e)
    )
    
    function checker(e) {
     if(!confirm('Are you sure?')) {
       e.preventDefault()
       alert('Form was not submitted')
     }else {
       alert('New user created')
     }
    }
    

谢谢,你是个救生员:)我不知道我需要将按钮类型设置为button而不是submit