jQuery表单提交不存储值?

时间:2019-11-22 17:48:26

标签: javascript php jquery html

我有一个用于验证用户输入的自定义方法,但是我的表单似乎没有提交。另外,URL在我第一次提交后就会更改,并且jquery仅在URL更改后才运行。

此代码的目的是检查提交的信息是否在数据库中。该函数运行,但是名称字段的值似乎在提交时未存储,因此我不断收到名称错误。

这是我的代码:

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"></script>
    <title>Smiles Galore (SG)</title>
    <script>
    $(document).ready(function(){
        $('#target').on('submit', function(){
                var emailChecker = $('#email').val();
                var idChecker = $('#number').val();
                var passCheck = $('#pwd').val();
                var userName = $('#text').val;
                if (userName.length <2){
                    alert("Please enter a name");
                }
                else{   
                    if (idChecker.toString().length != 8){
                        alert("That's not a proper input for ID. Please provide a proper ID");
                    }
                    else{
                        if (!hasUpperCase(passCheck)){
                            alert("That's not a password. Enter a proper password.");
                        }
                        else if(!/[0-9]/.test(passCheck)){
                            alert("That's not a password. Enter a proper password.");
                        }
                        else if(passCheck.length > 8){
                            alert("That's not a password. Enter a proper password.");
                        }
                        else{
                            Verification(userName,emailChecker,passCheck,idChecker);
                        }
                    }
                }
        function hasUpperCase(word){
            return word.toLowerCase()!=word;
        }

        function Verification(userName1,emailCheck1,passChecker,idCheck){
            var selection = $("list").val();
            alert("Hello");
            $.post('Access.php',{'Patron Email Address':emailCheck1,'Patron Name':userName1,'Patron ID':idCheck,'Patron Password':passChecker},function(data){
                if (data=='0'){
                    alert("The email is incorrect");
                    return;
                }
                else{
                    alert("You good");
                    if (selection == "Search for Appointment"){
                        $.post('Process.php',{'Patron Email Address':emailCheck1},function(){});
                    }
                    else if (selection == "Schedule an Appointment"){
                    return;
                    }
                    else if (selection == "Cancel an Appointment"){
                    return;
                    }
                    else if (selection == "Create/Register an Account"){
                    return;
                    }
                    return; 
                }
            }); 
        }
        return false;
        });
        });
    </script>
</head>
<body>
        <form id="target">
        <div class="form-group">
            <label for="text">Name:</label>
            <input type="text" class="form-control" id="text">
        </div>
        <div class="form-group">
            <label for="email">Email:</label>
            <input type="text" class="form-control" id="email">
        </div>
        <div class="form-group">
            <label for="pwd">Password:</label>
            <input type="password" class="form-control" id="pwd">
        </div>
        <div class="form-group">
            <label for="number">ID:</label>
            <input type="number" class="form-control" id="number">
        </div><br>
        <label for="list">Select an Option:</label><br>
        <select name="Select an Option:" id="list">
            <option value="Schedule an Appointment">Schedule an Appointment</option>
            <option value="Cancel an Appointment">Cancel an Appointment</option>
            <option value="Search for Appointment">Search for Appointment(s)</option>
            <option value="Create/Register an Account">Create/Register an Account</option>
        </select><br>
        <br><div>
            <input type="submit" class="btn btn-primary mb-2" value="Continue">
        </div>
        </form> 
</body>

1 个答案:

答案 0 :(得分:0)

您在val之后没有()的名字,就像在其他变量上一样。

var userName = $('#text').val;更改为var userName = $('#text').val();

这将解决您的姓名问题。

还注意到,您在#的jquery选择器中没有selection

var selection = $("list").val();更改为var selection = $("#list").val();