即使无效,jqBootstrapValidation表单也会提交

时间:2014-01-15 01:24:26

标签: javascript jquery forms validation twitter-bootstrap

您好我正在使用jqBootstrapValidation来验证表单,除密码外所有表现都很好。

例如,如果我尝试提交表格而不填写字段,它不会让我也不会让我提交表格,如果电子邮件不是形式为example@site.com但即使我添加了数据验证 - 匹配标记到我的第二个密码输入,如果密码不匹配,表单仍然会提交。

我的代码是:

<?php
$error = "";
include ('dblink.php');
session_start();
if(!empty($_SESSION['s_logged_n'])){
header("Location: index.php");
}
if($_SERVER['REQUEST_METHOD'] === 'POST')
{
if($_POST['form'] === 'login') 
    {
    $username = mysqli_escape_string($con, trim($_POST['user']));
    $password = md5(trim($_POST['password']));

    $query = mysqli_query($con,"SELECT * FROM Users WHERE Username = '$username' AND Password = '$password' LIMIT 1") or die(mysql_error());

    $row = mysqli_fetch_array($query);

    // now we check if they are activated

    if(mysqli_num_rows($query) > 0)
    {

        if($row['Activated'] > 0)
        {

            $_SESSION['s_logged_n'] = 'true';
            $_SESSION['s_username'] = $username;
            $_SESSION['s_name'] = $row['Name'];

            header("Location: index.php");

        }else
        {
            $error = "<Br><div class=\"alert alert-warning\">Your account hasnt yet been activated.</div>";
        }


    }
    else
        {
        $error = "<Br><div class=\"alert alert-danger\">Your username/password do not match.</div>";
        }
}
if($_POST['form'] === 'register') 
    {
        $first = addslashes(trim($_POST['fname']));
        $surname = addslashes(trim($_POST['lname']));
        $abr = mb_substr($surname, 0, 3);
        $username = $first . $abr;
        $email = addslashes(trim($_POST['email']));
        $poste = addslashes(trim($_POST['poste']));
        $pass = addslashes(trim($_POST['pass']));
        $salary = addslashes(trim($_POST['salary']));
        $conf = addslashes(trim($_POST['cpass']));
        $ip = $_SERVER['REMOTE_ADDR'];
        $date = date("d, m y");
        $password = md5($pass);
    }
}
?>
<DOCTYPE html>
<html>
<head>

<link href="css/bootstrap-theme.css" rel="stylesheet" type="text/css" />
<link href="css/bootstrap-theme.min.css" rel="stylesheet" type="text/css" />
<link href="css/bootstrap.min.css" rel="stylesheet" type="text/css" />
<link type="text/css" href="http://eonasdan.github.io/bootstrap-datetimepicker/styles/bootstrap-datetimepicker.min.css" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript" src="js/jqBootstrapValidation.js"></script>
<script type="text/javascript" src="js/bootstrap.min.js"></script>
<script type="text/javascript" src="http://eonasdan.github.io/bootstrap-datetimepicker/scripts/moment.js"></script>
<script type="text/javascript" src="http://eonasdan.github.io/bootstrap-datetimepicker/scripts/bootstrap-datetimepicker.js"></script>
<script>
  $(function () { $("input,select,textarea").not("[type=submit]").jqBootstrapValidation(); } );
</script>
<body >
<div style="background-color:#CC0000; height: 100%" >
</br>
</br>
</br>

<div class="container">
<div class="panel panel-default" >
  <div class="panel-body">
  <div class="page-header">
  <h1>Login</small></h1>
</div>


  <form class="form-horizontal" role="form" action="<?= $_SERVER['PHP_SELF'] ?>" method="post">

  <div class="input-group">
  <span class="input-group-addon"><span class="glyphicon glyphicon-user"></span>
</span>
  <input name="user" type="text" class="form-control" placeholder="Username">
</div></br>

 <div class="input-group">
  <span class="input-group-addon"><span class="glyphicon glyphicon-lock"></span>
</span>
  <input name="password" type="password" class="form-control" placeholder="Password">
</div>
 <?php echo $error;?> 

  <div class="form-group">
    <div class="col-sm-10">
      <div class="checkbox">
        <label>
          <input type="checkbox"> Remember me
        </label>
      </div>
    </div>
  </div>
  <div class="form-group">
    <div class="col-sm-10">
    <input type="hidden" name="form" value="login" />
      <button type="submit" id="login" name="login" class="btn btn-default">Sign in</button><button type="button" data-toggle="modal" data-target="#register" class="btn btn-warning btn-xs">Register</button>
    </div>
  </div>
</form>




 </div>
  </div>
</div>
</div>
<!-- Modal -->
<div class="modal fade" id="register" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
        <h4 class="modal-title" id="myModalLabel">Registration</h4>
      </div>
      <div class="modal-body">
   <form class="form-horizontal" role="form" action="<?= $_SERVER['PHP_SELF'] ?>" method="post">
  <div class="form-group">
    <label for="fname" class="col-sm-3 control-label">First Name</label>
    <div class="col-sm-9">
      <input type="text" class="form-control" id="fname" name="fname" placeholder="Your first name." required>
    </div>
  </div>
    <div class="form-group">
    <label for="lname" class="col-sm-3 control-label">Last Name</label>
    <div class="col-sm-9">
      <input type="text" class="form-control" id="lname" name="id="lname"" placeholder="Your last name." required>
    </div>
  </div>
      <div class="form-group">
    <label for="email" class="col-sm-3 control-label">Email</label>
    <div class="col-sm-9">
      <input type="email" class="form-control" id="email" name="email" placeholder="Your email." required>
    </div>
  </div>
  <div class="form-group">
    <label for="poste" class="col-sm-3 control-label">Poste</label>
    <div class="col-sm-9">
     <select class="form-control" id="poste" name="poste">
        <option value="Surface de Vente">Surface de Vente</option>
        <option value="Caisse">Caisse</option>
        <option value="Protection des biens">Protection des biens</option>
        <option value="Circulation des marchandises">Circulation des marchandises</option>
        <option value="Préposé à la marque">Préposé à la marque</option>
        <option value="Réserve">Réserve</option>
        <option value="Électronique">Électronique</option>
        <option value="Biens Modes">Biens Modes</option>
        <option value="Starbucks">Starbucks</option>
        <option value="Ressources humaines">Ressources humaines</option>
     </select> 
    </div>
  </div>
  <div class="form-group">
    <label for="salary" class="col-sm-3 control-label">Salary</label>
    <div class="col-sm-9">
      <input type="text" class="form-control" id="salary" name="salary" placeholder="Your salary." required>
    </div>
  </div>

  <div class="form-group">
    <label for="pass" class="col-sm-3 control-label">Password</label >
    <div class="col-sm-9">
      <input type="password" minlength="6" class="form-control" id="pass" name="pass" required>
    </div>
  </div>
    <div class="form-group">
    <label for="cpass" class="col-sm-3 control-label">Confirm</label>
    <div class="col-sm-9">
      <input type="password" minlength="6" class="form-control" id="cpass" name="cpass" data-validation-match-match="pass" required>
    </div>
  </div>



      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
        <input type="hidden" name="form" value="register" />
        <button type="submit" class="btn btn-danger">Register <span class="glyphicon glyphicon-ok"></span></button>
        </form>

      </div>
    </div><!-- /.modal-content -->
    </div><!-- /.modal-dialog -->
</div><!-- /.modal -->
</body>
</html>

表格中有:

<form class="form-horizontal" role="form" action="<?= $_SERVER['PHP_SELF'] ?>" method="post">
  <div class="form-group">
    <label for="fname" class="col-sm-3 control-label">First Name</label>
    <div class="col-sm-9">
      <input type="text" class="form-control" id="fname" name="fname" placeholder="Your first name." required>
    </div>
  </div>
    <div class="form-group">
    <label for="lname" class="col-sm-3 control-label">Last Name</label>
    <div class="col-sm-9">
      <input type="text" class="form-control" id="lname" name="id="lname"" placeholder="Your last name." required>
    </div>
  </div>
      <div class="form-group">
    <label for="email" class="col-sm-3 control-label">Email</label>
    <div class="col-sm-9">
      <input type="email" class="form-control" id="email" name="email" placeholder="Your email." required>
    </div>
  </div>
  <div class="form-group">
    <label for="poste" class="col-sm-3 control-label">Poste</label>
    <div class="col-sm-9">
     <select class="form-control" id="poste" name="poste">
        <option value="Surface de Vente">Surface de Vente</option>
        <option value="Caisse">Caisse</option>
        <option value="Protection des biens">Protection des biens</option>
        <option value="Circulation des marchandises">Circulation des marchandises</option>
        <option value="Préposé à la marque">Préposé à la marque</option>
        <option value="Réserve">Réserve</option>
        <option value="Électronique">Électronique</option>
        <option value="Biens Modes">Biens Modes</option>
        <option value="Starbucks">Starbucks</option>
        <option value="Ressources humaines">Ressources humaines</option>
     </select> 
    </div>
  </div>
  <div class="form-group">
    <label for="salary" class="col-sm-3 control-label">Salary</label>
    <div class="col-sm-9">
      <input type="text" class="form-control" id="salary" name="salary" placeholder="Your salary." required>
    </div>
  </div>

  <div class="form-group">
    <label for="pass" class="col-sm-3 control-label">Password</label >
    <div class="col-sm-9">
      <input type="password" minlength="6" class="form-control" id="pass" name="pass" required>
    </div>
  </div>
    <div class="form-group">
    <label for="cpass" class="col-sm-3 control-label">Confirm</label>
    <div class="col-sm-9">
      <input type="password" minlength="6" class="form-control" id="cpass" name="cpass" data-validation-match-match="pass" required>
    </div>
  </div>



      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
        <input type="hidden" name="form" value="register" />
        <button type="submit" class="btn btn-danger">Register <span class="glyphicon glyphicon-ok"></span></button>
        </form>

和javascript是:

<script>
  $(function () { $("input,select,textarea").not("[type=submit]").jqBootstrapValidation(); } );
</script>

我的js控制台没有错误,我不知道错误是什么,有人对此很熟悉吗?

也忽略了最小角色。

0 个答案:

没有答案