使用JQuery進行驗證並通過PHP進行處理

Question

我想使用JQuery驗證我的表單並使用php將其發送到我的數據庫。

這就是我嘗試過的：

<body>

    <form id="first_form" method="post" action="">
      <div>
        <label for="first_name">First Name:</label>
        <input type="text" id="first_name" name="first_name"></input>
      </div>
      <div>
        <label for="last_name">Last Name:</label>
        <input type="text" id="last_name" name="last_name"></input>
      </div>
      <div>
        <label for="handphone">Handphone:</label>
        <input type="text" id="handphone" name="handphone"></input>
      </div>
      <div>
        <input type="submit" value="Submit" />
      </div>
    </form>

<script>

    $(document).ready(function() {

      $('#first_form').submit(function(e) {
        e.preventDefault();
        var first_name = $('#first_name').val();
        var last_name = $('#last_name').val();
        var handphone = $('#handphone').val();

        $(".error").remove();

        if (first_name.length < 1) {
          $('#first_name').after('<span class="error">This field is required</span>');
          return false;
        }
        if (last_name.length < 1) {
          $('#last_name').after('<span class="error">This field is required</span>');
          return false;
        }
        if (handphone.length < 1) {
          $('#handphone').after('<span class="error">This field is required</span>');
          return false;
        } 

      });

    });

</script>


<?php   

    $first_name = "<script>var first_name = $('#first_name').val();</script>";
    $last_name = "<script>var first_name = $('#last_name').val();</script>";
    $handphone = "<script>var first_name = $('#handphone').val();</script>";

    $servername = "localhost";
    $username = "root";
    $password = "";
    $dbname = "test";

    // Create connection
    $conn = new mysqli($servername, $username, $password, $dbname);
    // Check connection
    if ($conn->connect_error) {
        die("Connection failed: " . $conn->connect_error);
    } 

    $sql = "INSERT INTO vali (first_name, last_name, handphone)
    VALUES (first_name, last_name, handphone)";

    if ($conn->query($sql) === TRUE) {
        echo "New record created successfully";
    } else {
        echo "Error: " . $sql . "<br>" . $conn->error;
    }

    $conn->close();
?>

</body>

如您所見，第一部分只是html和表單。

第二部分是我使用Jquery驗證（哪些工作）。

現在問題是在php部分，它將數據作為空發送到我的數據庫。

我的PHP代碼背后的邏輯是，我獲取我在Jquery中設置的變量的值，並將其更新到數據庫。 但它更新了空值。

我試圖在Jquery中返回false，但它不適合我。 我可以知道我在這里做錯了什么嗎？

Answer 1

第一，您必須了解JavaScript在這種情況下是一種客戶端腳本語言，而PHP是一種服務器腳本語言。 變量無法從JavaScript傳遞給PHP是<script>標記。

其次，我們有不同類型的請求; GET ， POST ， PUT ， DELETE等等。 我們可以通過PHP查看。 在我輸入此答案，GET和POST請求時，表單只能發送兩種類型的請求，這是您在表單中設置的方法值。 可以在請求全局數組中訪問表單中設置的每個值，並且值的名稱是鍵/ indetifier。 $_GET[]如果您發送了get請求， $_POST[]如果您發送了一個帖子請求。

在上面的表單中，您的方法設置為POST，這意味着所有值都可以在全局$_POST[] 。

當頁面加載時，服務器腳本首先在客戶端/ HTML / CSS和文檔使用的其他資源之前加載。

PHP有一個名為isset()的函數，用於檢查變量是否可用而不管它的值是否對表單驗證非常有用。

如果你在文件執行邏輯/操作中有PHP代碼，建議你將它們放在最上面的文件中，因為它不用於渲染文檔/視圖。

從您的代碼中，您應該編輯為

<?php

    if(isset($_POST['submit'])){ 
        // This block will only be executed when a submit button is triggered

       //Make your connection here, it is not a must but good practice to always make connection first in order to make it available everywhere. Ensure to check if connection was successful or not.

     $first_name = $_POST['first_name']; // this gives you the exact value you passed in the form.

       ... 
       // All you variables should be assigned using the above method

     //in the above assignation of variables, we didn't sanitize. mysqli has a method real_escape_string() which does that for us. Ensure to always sanitize and properly validate inputs you send to your DB

    //Sanitizing inputs
    $first_name = $con ->real_escape_string($first_name);

    // Do the above for other inputs, then you are good to perform an insert.

   $result = $conn->query($sql);
   if($result){
       //Record has been inserted, you can choose to redirect or do some other logic
   }else{ 
       //Record was not successfully inserted. Print your error if in development to get an insight to what went wrong
  }

  }

  $conn->close()

?>

使用JQuery進行驗證並通過PHP進行處理

問題描述

1 個解決方案

解決方案1
3 已采納 2018-11-08 06:15:57

使用JQuery進行驗證並通過PHP進行處理

問題描述

1 個解決方案

解決方案1 3 已采納 2018-11-08 06:15:57

解決方案1
3 已采納 2018-11-08 06:15:57