在php中使用ajax向mysql数据库中插入数据

Question

我试图在 php 中使用 ajax 插入值，但数据未插入数据库中。我从本网站其他问题中回答的问题中获取了这段代码。谁能建议我在哪里犯错..？

 <script>
  $("#submit").click(function() {
                var name= $("#name").val();
                var password= $("#password").val();

                $.ajax({
                    type: "POST",
                    url: "insert.php",
                    data: "name=" + name+ "&password=" + password,
                    success: function(data) {
                       alert("sucess");
                    }
                });

            });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.0/jquery.min.js"></script>

<?php
    //------insert.php------
     $servername = "localhost";
    $username = "username";
    $password = "password";
    $dbname = "dbname";

    // Create connection
    $conn = new mysqli($servername, $username, $password,$dbname);

    // Check connection
    if ($conn->connect_error) {
        die("Connection failed: " . $conn->connect_error);
    }

          $name=$_POST['name'];
            $pass=$_POST['password'];
             $sql= mysqli_query($conn,"INSERT INTO insert_tbl(name,pass) VALUES('".$name."','".$pass."')");

 ?>

原文由 Dhruvi Mistry 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

<script>
  $("#FORM_ID").submit(function() {
                var name= $("#name").val();
                var password= $("#password").val();

                $.ajax({
                    type: "POST",
                    url: "insert.php",
                    data: "name=" + name+ "&password=" + password,
                    success: function(data) {
                       alert("sucess");
                    }
                });

            });
</script>

也可以加载

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.0/jquery.min.js"></script>

在你的脚本标签之前或使用

 <script>
$(document).ready(function(){
      $("#FORM_ID").submit(function() {
                    var name= $("#name").val();
                    var password= $("#password").val();

                    $.ajax({
                        type: "POST",
                        url: "insert.php",
                        data: "name=" + name+ "&password=" + password,
                        success: function(data) {
                           alert("sucess");
                        }
                    });

                });
        });
    </script>

原文由 Tsotne Kekelia 发布，翻译遵循 CC BY-SA 3.0 许可协议

Answer 2

这是用于插入数据的 html 表单

<form id="frmrecord" method="post">
    <input type="text" name="txtusermame" />
    <input type="password" name="txtpassword" />
    <input type="submit" value="Insert" />
</form>

使用此代码调用 insert.php 文件插入数据

jQuery(document).ready(function ($) {

    $("#frmrecord").submit(function (event) {
                event.preventDefault();
                //validation for login form
        $("#progress").html('Inserting <i class="fa fa-spinner fa-spin" aria-hidden="true"></i></span>');

            var formData = new FormData($(this)[0]);
            $.ajax({
                url: 'insert.php',
                type: 'POST',
                data: formData,
                async: true,
                cache: false,
                contentType: false,
                processData: false,
                success: function (returndata)
                {
                    //show return answer
                    alert(returndata);
                },
                error: function(){
                alert("error in ajax form submission");
                                    }
        });
        return false;
    });
});

调用文件后，您可以在 php 文件 Insert.php 中接收数据

<?php
  $usernmae=$_POST['txtusername'];
  $password=$_POST['password'];
  $sql= mysqli_query($conn,"INSERT INTO insert_tbl(name,pass)
    VALUES('".$usernmae."','".$password."')");
 ?>

下载演示

原文由 Sanju Yadav 发布，翻译遵循 CC BY-SA 3.0 许可协议