JQuery event.preventdefault和php

时间:2013-10-04 00:12:13

标签: php jquery

我有一个关于event.preventdefault的问题。我在客户端验证时使用它只是为了确保填写用户名和密码。但是当我按下提交按钮并将验证传递给php时,我什么也没得到。我的意思是当我检查表单是否已提交并做了回音以检查我什么也没得到。但是当我做的时候(!isset($ _ POST ['what what])我得到了一些东西。同样可以检查字段是否为空。当我清空时我什么都没有,但是当我做的时候得到了什么!空

Jquery / html代码

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title></title>
    <!-- Bootstrap core CSS -->
    <link href="css/bootstrap.min.css" rel="stylesheet" media="screen">
    <link href="css/verneyCustom.css" rel="stylesheet" type="text/css">
  </head>
  <body>
    <div class="container">
      <!-- cms login form -->
      <form action="login.php" method="POST" class="form-signin" id="cms-signin">
        <h2 class="form-signin-heading">Please sign in</h2>
        <span class="text-center" id="jsError"></span><!-- display client side errors -->
        <input type="text" class="form-control" id="username" placeholder="Username" autofocus><br/>
        <input type="password" class="form-control" id="password" placeholder="Password"><br/>
        <input type="submit" class="btn btn-lg btn-primary btn-block" id="loginToSystem" value="Sign In">
      </form>
    </div> 

    <!-- include jquery v1.10.2 library to validate client side  -->
    <script src="js/jquery.js"></script>
    <script> 
        //if the form is submitted check if values are ok
        $("#cms-signin").submit(function(event){
            if($('#username').val() == "" || $('#password').val() == ""){
                event.preventDefault();
                $("#jsError").html('You must fill in the form.');
            }else if($('#username').val() == ""){
                event.preventDefault();
                $("#jsError").html('Username is required.');
            }else if($('#password').val() == ""){
                event.preventDefault();
                $("#jsError").html('Password is required.');
            }
        }); 
    </script>
  </body>
</html>

php code

<?php

    //include the connection to the cms database
    require_once($_SERVER['DOCUMENT_ROOT'].'/vcm/_cms/resources/database_connect.php');

    //check if the form was sent
    if(isset($_POST['loginToSystem'])){
        echo 'o';
        //create an array for errors
        $errors = array();

        //check if the username and password fields are empty
        //yes we did a check if jquery on the front but some people disable javascript
        if(empty($_POST['username']) || empty($_POST['password'])){
            echo 'empty';
        }else{
            echo 'ok';
        }
    }
    echo'p';

?>

所以基本上它回显'p'无论如何,但只有当isset改为!isset时才会回显'o'。当它保持原样时它将返回空,当更改为!empty

时它会正常

1 个答案:

答案 0 :(得分:3)

asnene解释说你必须添加名字

<form action="login.php" method="POST" class="form-signin" id="cms-signin">
        <h2 class="form-signin-heading">Please sign in</h2>
        <span class="text-center" id="jsError"></span><!-- display client side errors -->
        <input type="text" class="form-control"  name="username" id="username" placeholder="Username" autofocus><br/>
        <input type="password" class="form-control" name="password" id="password" placeholder="Password"><br/>
        <input type="submit" class="btn btn-lg btn-primary btn-block" id="loginToSystem" value="Sign In">
</form>

你也需要&amp;&amp;不是||

$("#cms-signin").submit(function(event){
        if($('#username').val() == "" && $('#password').val() == ""){
            event.preventDefault();
            $("#jsError").html('You must fill all fields.');
        }
    });