0

注册.php

<head>
<script>
    function myFunction() {
        var userName=document.getElementById('fname').value;
        var userLastName=document.getElementById('lname').value;
        var userEmail=document.getElementById('email').value;
        var userContact=document.getElementById('contact').value;
       //alert(userContact);
       var phoneno = /^\d{10}$/;
        var letters=/^[A-Za-z]+$/;

       if (letters.test(userName)) {

       }else{
       // swal("First Name contain only letters and whitespaces");
       swal({
        title: "Error!",
        text: "First Name contain only letters and whitespaces",
        type: "error",
        confirmButtonText: "OK"
        })
        exit;
       }

       if (letters.test(userLastName)) {

       }else{
        //alert("Last name contains only letters and whitespaces");
        swal({
            title:"Error!",
            text:"Last name contains only letters and whitespaces",
            type:"error",
            confirmButtonText:"OK"

            })
        exit;
       }
           if (phoneno.test(userContact)) {

       }else{
        //alert(" contact number is of 10 digit");
        swal({
            title:"Error!",
            text:"contact number is of 10 digit",
            type:"error",
            confirmButtonText: "OK"
            })
        exit;
       }
    ///alert("succes");
       //swal({
       // title:"Congratulation!",
       // text:"You are successfully Registreared.",
       // type:"success",
       // confirmButtonText: "OK",
       // })
      swal('Congratulations!','Your are successfully Register','success');

    }
</script>
</head>
    <body>
       <div id='Registration'>
    <form  action='Insert.php' method='post'>
    <table id='myTable'>
        <tr>
            <td id='tableName' colspan='2' style='text-align: center'>Registration</td>
    </tr>
    <tr>
        <td>First Name: </td>
        <td><input  type='text' id='fname' name='fname' required></td>
    </tr>
    <tr>
        <td>Last Name:</td>
        <td><input type='text' id='lname' name='lname' required></td>
    </tr>
    <tr>
        <td>Email:</td>
        <td><input type='email' id='email' name='email' required></td>
    </tr>
    <tr>
        <td>Contact:</td>
        <td><input type='text' id='contact' name='contact' required></td>
    </tr>
    <tr>
        <td colspan='2' style='text-align: center'><input  type='submit' id='submit' value='SUBMIT' name='submit' onclick='myFunction()'></td>
    </tr>
</table>
</form>
</div>
 <body>

这是我的 sweetAlert 函数，它适用于错误，但对于成功它不能正常工作。为了成功，它迫不及待地想要得到 sweetAlert 的响应。他们的形式 action='insert.php' method='post' 有什么问题吗？
请给我适当的解决方案？

4

1 回答 1

0

php没有什么。

这是表单提交的正常流程。执行最后一行onclick处理程序后，浏览器开始将表单发送到服务器。任何本机浏览器对话框alert都可以暂停此过程，但没有自定义 js 警报。如果您想等到用户关闭警报，那么您应该阻止表单提交并手动提交。

  1. 为了防止表单提交（默认行为），您应该return false从您的onclick处理程序 - 一种可能的方式。

  2. 手动提交表单使用form.submit()方法

  3. 使用sval函数的第二个参数添加将在用户关闭成功对话框后执行的回调 - http://t4t5.github.io/sweetalert/

所以结果代码可能如下所示：http: //jsfiddle.net/7Ld8L6y5/

function myFunction() {
    var userName=document.getElementById('fname').value;
    var userLastName=document.getElementById('lname').value;
    var userEmail=document.getElementById('email').value;
    var userContact=document.getElementById('contact').value;

    var form = document.getElementById('myForm');
    var onDialogClose = function () {
        console.log(form);
        form.submit();
    };

    var phoneno = /^\d{10}$/;
    var letters=/^[A-Za-z]+$/;

    if (!letters.test(userName)) {
        swal({
            title: "Error!",
            text: "First Name contain only letters and whitespaces",
            type: "error",
            confirmButtonText: "OK"
        });
        return;
    }

    if (!letters.test(userLastName)) {
        swal({
            title:"Error!",
            text:"Last name contains only letters and whitespaces",
            type:"error",
            confirmButtonText:"OK"

        });
        return;
    }

    if (!phoneno.test(userContact)) {
        swal({
            title:"Error!",
            text:"contact number is of 10 digit",
            type:"error",
            confirmButtonText: "OK"
        })
        return;
    }

    swal({
        title: 'Congratulations',
        text: 'Your are successfully Register',
        type: 'success'
    }, onDialogClose);
}

您还需要更新您的 html 代码：

  1. 首先，您应该更新按钮的onclick事件处理程序submit以防止默认行为 -onclick='myFunction(); return false;'
  2. 其次，您应该将submit按钮重命名为 smth。喜欢send能够调用默认form.submit方法。否则form.submit将引用您的按钮 -<input type='submit' id='send' value='SUBMIT' name='send' onclick='myFunction(); return false;'>

您的原始脚本也包含一个错误：javascript没有内置exit函数。要跳过函数代码的其余部分的执行并立即返回一个控件 - 使用该return false;语句。

于 2015-10-14T16:22:53.610 回答