如何同时进行客户端和服务器端验证？

Question

我正在创建一个 HTML 表单，我在其中进行客户端和服务器端验证。我使用了以下代码。

<form action='logic.php' method='post' id='login'>

    <input type='text' placeholder='Enter name' name='name'>

    <input type='submit'>

</form>

// Jquery

$(document).ready(function(){

    function validate_name(input_id,error_id,msg="Name"){

        const x = document.getElementById(input_id).value;

        const y = document.getElementById(error_id);

        const pattern = /^[a-zA-Z]+$/

        if(x!==""){

            if(pattern.test(x) ){

                if(x.length<3 || x.length>10){

                    y.innerHTML = msg+' should be between 3 and 10 characters.'

                    return false;

                }

                else{

                    y.innerHTML = '';

                    return true;

                }

            }

            else{

                y.innerHTML = 'Should contain only alphabets.'

                return false;

            }

        }

        else{

            y.innerHTML = "Please Enter Your "+msg;

            return false;

        }

    }

    $('#login').submit(function(e){

        e.preventDefault();

        let name = validate_name('rollno','rerror');

        let subject_name = validate_select('subject_dropdown','serror');

        if(name === true & subject_name === true){

            window.location = 'controller/indexPage_logic.php';

        }

    })

});

我可以进行客户端验证，但如果表单得到正确验证，我将无法在服务器端 PHP 中使用 $_POST['name'] 访问输入值。我认为这是由于 window.location。是否存在有没有更好的方法来进行双方验证？

Answer 1

在表单的操作参数中设置正确的文件。在 if 条件中，写e.currentTarget.submit();if(name&nbsp;===&nbsp;true&nbsp;&&nbsp;subject_name&nbsp;===&nbsp;true){ &nbsp;&nbsp;&nbsp;&nbsp;e.currentTarget.submit(); }

Answer 2

当您需要 POST 时，您的位置更改会执行 GET改成$('#login').submit(function(e){&nbsp; &nbsp; e.preventDefault();&nbsp; &nbsp; let name = validate_name('rollno','rerror');&nbsp; &nbsp; let subject_name = validate_select('subject_dropdown','serror');&nbsp; &nbsp; if(name === true & subject_name === true){&nbsp; &nbsp; &nbsp; &nbsp; $.post('controller/indexPage_logic.php', {name:rollno}, function(response) { console.log(response)}); // do what you need to do when valid on the server too&nbsp; &nbsp; }})

Answer 3

您必须将您的数据发送到服务器，问题是 window.location 没有向服务器发送任何请求以便能够协助使用$.post('url to the server', { data1 : "Your data", data2 : yourvar }, function(res) {&nbsp; &nbsp;console.log(res)});