Question

因此，我有此表单可将一个人添加到数据库：

<div id="formDiv">
        <form id="form1" method="post" action="#">
            <input type="text" name="title" placeholder="Title">
            <br>
            <input type="text" name="firstname" placeholder="First Name">
            <br>
            <input type="text" name="lastname" placeholder="Last Name">
            <br>
            <input type="text" name="group" placeholder="Group">
            <br>
            <input type="text" name="company" placeholder="Company">
            <br>
            <select name="sex" required>
                <option value="" disabled selected>Sex/option>
                <option value="male">male</option>
                <option value="female">female</option>
            </select>
            <br>
            <button type="submit" id="insert" name="insert">Insert</button>
        </form>
        </div>

还有一个php文件，用于将数据插入数据库：

<?php
    include($_SERVER['DOCUMENT_ROOT'].'/website/dbConnection.php');
    include($_SERVER['DOCUMENT_ROOT'].'/website/administrator/components/com_backend/backend.php');

    if(isset($_POST['insert'])){
        $title = $_POST['title'];
        $firstname = $_POST['firstname'];
        $lastname = $_POST['lastname'];
        $group = $_POST['group'];
        $company = $_POST['company'];
        $sex = $_POST['sex'];

        if ($sex == "male"){
            $sex = 0;
        }
        else{
            $sex = 1;
        }

        $query    = "INSERT INTO members (Title, Firstname, Lastname, Group, Company, Sex) 
             VALUES('$title', '$firstname', '$lastname', '$group', '$company', '$sex')";

        mysqli_query($GLOBALS['connect'], $query);
    }

我知道2个文件之间存在通信问题。因为第二个文件没有收到第一个文件的POST。

当我使用第一个文件并按提交按钮时，它将重新加载页面，并且不向数据库输入任何内容。

当我直接导航到第二个文件时，因为包含了第一个文件，所以可以使用该表格。因此，我填写了表单，按下了提交按钮，就像魔术一样，它在那里起作用！

当包含第一个文件100次时，我已经检查了路径。这是正确的。当包含100次数据库连接时，我已经检查了路径。这是正确的。我直接在数据库中运行查询。这是正确的。

我假设我犯了一个小错误，发现不了，但是代码又小又简单，简直就是不可能。

Answer 1

<form id="form1" method="post" action="your_php_file.php">

这将指向您的php文件，并从前端向后端进行POST请求。根据您的代码，您不会向您的php文件发送任何内容。因此，您那里的代码可能会起作用，但是您的请求永远不会发送到php文件，因此数据库中不会放置任何内容。

修改

为了不按您的要求重新加载页面，则不应提交表单，而必须在后端进行ajax调用。

  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<div id="formDiv">
    <input type="text" name="title" placeholder="Title">
    <br>
    <input type="text" name="firstname" placeholder="First Name">
    <br>
    <input type="text" name="lastname" placeholder="Last Name">
    <br>
    <input type="text" name="group" placeholder="Group">
    <br>
    <input type="text" name="company" placeholder="Company">
    <br>
    <select name="sex" required>
        <option value="" disabled selected>Sex/option>
        <option value="male">male</option>
        <option value="female">female</option>
    </select>
    <br>
    <button type="button" id="insert" name="insert">Insert</button>
</div>


<script>


    $( "#insert" ).click(function() {
        let title = $("input[name=title]").val();
        let firstname = $("input[name=firstname]").val();
        let lastname = $("input[name=lastname]").val();
        let group = $("input[name=group]").val();
        let company = $("input[name=company]").val();
        let sex = $("input[name=sex] option:selected").text();


        $.ajax({
            method: 'POST',
            url: 'your_php_file.php',
            data: {'title': title, 'firstname': firstname, 'lastname': lastname, 'group': group, 'company': company, 'sex': sex},
            success: function (response) {
                console.log(works)
            },
            error: function (jqXHR, textStatus, errorThrown) {
                console.log(JSON.stringify(jqXHR));
                console.log("AJAX error: " + textStatus + ' : ' + errorThrown);
            }
        });
    })
</script>

这样，数据将被发送到您的后端，您可以像以前一样处理它。它采用json格式，因此如果需要，请不要忘记解码。

Answer 2

    <div id="formDiv">
        <form id="form1" method="post" action="#">
            <input type="text" name="title" placeholder="Title">
            <br>
            <input type="text" name="firstname" placeholder="First Name">
            <br>
            <input type="text" name="lastname" placeholder="Last Name">
            <br>
            <input type="text" name="group" placeholder="Group">
            <br>
            <input type="text" name="company" placeholder="Company">
            <br>
            <select name="sex" required>
                <option value="" disabled selected>Sex/option>
                <option value="0">male</option>
                <option value="1">female</option>
            </select>
            <br>
            <button type="submit" id="insert" name="insert">Insert</button>
        </form>
    </div>
<script>
    $('#form1').submit(function (e) {

    e.preventDefault();
        var senddata = $(this).serializeArray();
        var sendto = $(this).attr("action");

    $.ajax({
        url: sendto,
        type: 'POST',
        data: senddata,
            success: function (data) {
            $('.messages').html(data);
            },
            error: function (error) {
            $('.messages').html(error);
            }
        });
    });
</script>

POST请求未收到

2 个答案: