2016-08-14 21 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

很高興聽到:)你的要求是簡單地驗證兩個密碼,這不一定需要表單提交和所有。 –

相關問題