2016-08-14 41 views
1

我在这里将我的PHP代码与设计及其后端过程一起使用。使用Ajax时,如果在用户输入数据时'createpassword'和'confirmpassword'不匹配时弹出警告消息,那么正确的语法是什么?如何在不使用页面刷新的情况下使用PHP中的Ajax提醒消息框?

我尝试使用JavaScript类型的警告框,但每次用户输入密码时都会刷新表单。我希望它只显示一个警告框,它不会刷新页面。有没有人有任何想法?

这是我的PHP设计:

<?php 
    $MonthArray = array(
     1=>"January", 
     2=> "February", 
     3=> "March", 
     4=> "April", 
     5=> "May", 
     6=> "June", 
     7=> "July", 
     8=> "August", 
     9=> "September", 
     10=> "October", 
     11=> "November", 
     12=> "December", 
    ); 
?> 

<!DOCTYPE html> 
<html> 
<head> 
    <title>Sign up</title> 
</head> 
<body> 
    <div id="container"> 
     <div id="signup"> 
      <form action="SignupProcess.php" method="POST"> 
       <!-- Complete Name --> 
       <div class="Name"> 
        <label><span style="font-weight:bold">Name</span></label> 
        <br> 
        <input type="text" name="firstname" size="15" placeholder="First" required> 
        <input type="text" name="lastname" size="15" placeholder="Last" required> 
       </div> 
       <br> 

       <!-- Username --> 
       <div class="Username"> 
        <label><span style="font-weight:bold">Choose your username</span></label><br> 
        <input type="text" name="username" size="35" required> 
       </div> 
       <br> 

       <!-- Password --> 
       <div class="Password"> 
        <label><span style="font-weight:bold">Create a password</span></label><br> 
        <input type="password" name="createpassword" size="35" required> 
        <br><br> 

        <label><span style="font-weight:bold">Confirm your password</span></label><br> 
        <input type="password" name="confirmpassword" size="35" required> 
       </div> 
       <br> 

       <!-- Birthdate --> 
       <div class="Birthdate"> 
        <select name="month" required> 
         <option disabled selected>Month</option> 
         <?php foreach($MonthArray as $monthkey => $value) { ?> 
          <option value="<?php echo $monthkey ?>"><?php echo $value ?></option> 
         <?php }?> 
        </select> 

        <input type="text" name="day" placeholder="Day" size="5" required> 

        <select name="year" required> 
         <?php 
          foreach(range(1990, (int)date("Y")) as $year) { 
           echo "\t<option value='".$year."'>".$year."</option>\n\r"; 
           rsort($year); 
          } 
         ?> 
        </select> 
       </div> 

       <!-- Buttons --> 
       <div class="Buttons"> 
        <input type="submit" id="signup" name="signupsubmit"> 
        <input type="reset" id="reset" name="signupreset"> 
       </div> 

      </form> 
     </div> 
    </div> 
</body> 
</html> 

而且它的PHP程序:

<?php 
    include("CreateConnection.php"); 

    // Get values from form Signup.php file 
    $FirstName = mysqli_real_escape_string($connect, $_POST['firstname']); 
    $LastName = mysqli_real_escape_string($connect, $_POST['lastname']); 
    $Username = mysqli_real_escape_string($connect, $_POST['username']); 
    $CreatePassword = mysqli_real_escape_string($connect, $_POST['createpassword']); 
    $ConfirmPassword = mysqli_real_escape_string($connect, $_POST['confirmpassword']); 
    $Month = mysqli_real_escape_string($connect, $_POST['month']); 
    $Day = mysqli_real_escape_string($connect, $_POST['day']); 
    $Year = mysqli_real_escape_string($connect, $_POST['year']); 

    // Removes back slashes in input 
    $FirstName = stripcslashes($FirstName); 
    $LastName = stripcslashes($LastName); 
    $Username = stripcslashes($Username); 
    $CreatePassword = stripcslashes($CreatePassword); 
    $ConfirmPassword = stripcslashes($ConfirmPassword); 
    $Month = stripcslashes($Month); 
    $Day = stripcslashes($Day); 
    $Year = stripcslashes($Year); 

    if($CreatePassword != $ConfirmPassword) 
    { 
     echo "<script type='text/javascript'>alert('Password does not match please check.');</script> "; 
     echo "<script>setTimeout(\"location.href = 'Signup.php'\", 0)</script>"; 
    } 
    else 
    { 
     // Query Insert into tablereminders 
     $query = mysqli_query($connect, "INSERT INTO `tablereminders`(`username`, `password`, `firstname`, `lastname`, `Month`, `Day`, `Year`) 
     VALUES ('$Username','$ConfirmPassword','$FirstName','$LastName','$Month','$Day','$Year')"); 
    } 

    // Error connection and query 
    if(mysqli_query($connect, $query)) 
    { 
     echo "New record created successfully"; 
     echo "<script>setTimeout(\"location.href = 'LoginReminder.php'\", 500)</script>"; 
    } 
?> 

这里这段代码是我将显示一个警告框不刷新页面。

if($CreatePassword != $ConfirmPassword) 
{ 
    echo "<script type='text/javascript'>alert('Password does not match please check.');</script> "; 
    echo "<script>setTimeout(\"location.href = 'Signup.php'\", 0)</script>"; 
} 

我想在我的SignupProcess.php中添加一个Ajax请求。可以从外部调用表单功能吗?

+0

你可能应该有'PHP'输出'JSON',然后解析JavaScript中的'JSON'并以这种方式显示输出。 – Derek

+1

我认为在'mysqli_real_escape_string'后面调用'stripcslashes'会让你容易受到SQL注入的攻击。在任何情况下,checkout prepare语句,如果你使用它们,你的代码会简单得多:[我怎样才能防止PHP中的SQL注入?](https://stackoverflow.com/questions/60174/how-cani-i-预防SQL注入在PHP) –

+0

是的,我是新来的PHP和搜索一些好方法,以防止SQL注入我会改变它。 –

回答

1

你可以做到这一点的验证简单地使用这样的JavaScript代码:

<?php 
    $MonthArray = array(
     1 => "January", 
     2 => "February", 
     3 => "March", 
     4 => "April", 
     5 => "May", 
     6 => "June", 
     7 => "July", 
     8 => "August", 
     9 => "September", 
     10 => "October", 
     11 => "November", 
     12 => "December", 
    ); 
?> 

<!DOCTYPE html> 
<html> 
    <head> 
     <title>Sign up</title> 
     <script type="text/javascript"> 
      function validate_form() { 

       var createpass = document.getElementById("createpassword").value; 
       var confirmpass = document.getElementById("confirmpassword").value; 

       if (createpass != confirmpass) { 

        alert("Password does not match please check."); 
        document.getElementById("createpassword").focus(); 
        return false; 
       } 
       return true; 
      } 
     </script> 
    </head> 

    <body> 
     <div id="container"> 
      <div id="signup"> 
       <form action="SignupProcess.php" method="POST" onsubmit="return validate_form();"> 
        <!-- Complete Name --> 
        <div class="Name"> 
         <label><span style="font-weight:bold">Name</span></label> 
         <br> 
         <input type="text" name="firstname" size="15" placeholder="First" required> 
         <input type="text" name="lastname" size="15" placeholder="Last" required> 
        </div> 
        <br> 

        <!-- Username --> 
        <div class="Username"> 
         <label><span style="font-weight:bold">Choose your username</span></label><br> 
         <input type="text" name="username" size="35" required> 
        </div> 
        <br> 

        <!-- Password --> 
        <div class="Password"> 
         <label><span style="font-weight:bold">Create a password</span></label><br> 
         <input type="password" name="createpassword" id="createpassword" size="35" required> 
         <br><br> 

         <label><span style="font-weight:bold">Confirm your password</span></label><br> 
         <input type="password" name="confirmpassword" id="confirmpassword" size="35" required> 
        </div> 
        <br> 

        <!-- Birthdate --> 
        <div class="Birthdate"> 
         <select name="month" required> 
          <option disabled selected>Month</option> 
          <?php foreach ($MonthArray as $monthkey => $value) { ?> 
           <option value="<?php echo $monthkey ?>"><?php echo $value ?></option> 
          <?php } ?> 
         </select> 

         <input type="text" name="day" placeholder="Day" size="5" required> 

         <select name="year" required> 
          <?php 
          foreach (range(1990, (int) date("Y")) as $year) { 
           echo "\t<option value='" . $year . "'>" . $year . "</option>\n\r"; 
           rsort($year); 
          } 
          ?> 
         </select> 
        </div> 

        <!-- Buttons --> 
        <div class="Buttons"> 
         <input type="submit" id="signup" name="signupsubmit"> 
         <input type="reset" id="reset" name="signupreset"> 
        </div> 

       </form> 
      </div> 
     </div> 
    </body> 
</html> 

我添加id属性的两个密码字段,然后在你的表单标签添加onsubmit="return validate_form();"功能。

您可以看到头部标签中添加了JavaScript功能。

让我知道它是否适合你。

+0

哦,它的工作!非常感谢。我认为只使用ajax可以执行该操作。 –

+1

很高兴听到:)你的要求是简单地验证两个密码,这不一定需要表单提交和所有。 –

相关问题