在按钮onclick事件之前验证表单数据

时间:2018-10-19 09:54:08

标签: javascript php html validation onclick

我真的被这个迷住了。

我有一个发送电子邮件的表格,因此必须验证输入内容。我有一些工作方法可以验证输入,与删除和发送按钮相同,mail()函数也可以工作。

现在的麻烦是,如果单击发送按钮,它应该
首先验证数据(或在invalide上打印错误)
,然后
< strong>显示确认弹出窗口,如果用户确实要发送邮件。

我不知道如何完成该操作。

我的摘录下面

将表单值分配给变量并验证输入(我将仅向您显示电子邮件验证,否则被剪断的时间太长,所有验证都可以正常工作)

<?php

ini_set("display_errors", "off");


$email = "";
$betreff = "";
$message = "";
$urgend = "";

if ($_SERVER["REQUEST_METHOD"] == "POST") {

$email = validateEmail($_POST["email"]);
$betreff = validateBetreff($_POST["betreff"]);
$message = validateMessage($_POST["message"]);

if ($urgend = $_POST["urgend"]) {
    $urgend = "dringend";
} else {
    $urgend = "nicht dringend";
}
}

function validateEmail($email)
{

if (!filter_var($email, FILTER_VALIDATE_EMAIL)) {

    $error = '<p style="color:red; text-align:center"><strong>Ung&uumlltige email formatierung!</strong><br>Beispiel f&uumlr eine g&uumlltige Email: abc@beispiel.de<br></p>';
    echo $error;

} else {

    return $email;
}

}

和我的“发送”按钮

 <button type="submit" name="submit" value="submit" onclick="if(!window.confirm('Jetzt senden?')) return false;">
    Senden
</button>

再次实现目标:

第一次验证输入
第二次确认弹出窗口
第三次尝试发送邮件

当前操作:

第一个确认弹出窗口
第二次验证输入
第三次尝试发送邮件

2 个答案:

答案 0 :(得分:1)

请尝试以下代码

    ctrl.menuIdentifier = 'FullMenu';
    ctrl.purposes = [
          { name: 'Small Health Potion', cost: 4 },
          { name: 'Small Mana Potion', cost: 5 },
          { name: 'Iron Short Sword', cost: 12 }
        ];

    ctrl.getContextMenu = function () {
        return ContextMenuService.contextMenuSetup(ctrl.menuIdentifier, callbackParameters);
    };

    ctrl.menuIdentifier = 'FullMenu';
    var callbackParameters = {
        deleteRow: function (indexforremoval) {
            ctrl.purposes.slice(indexforremoval);
        }
    }

答案 1 :(得分:0)

最简单的解决方案是使用基于浏览器的字段验证。 为此,只需更改您接受电子邮件的字段的类型即可(前提是您仅需要现代浏览器的支持)

<input type = "email" name = "email" placeholder = "E-Mail" />

但是更漂亮的解决方案是使用Ajax。