Question

我试图通过Ajax请求将数据从输入插入到SQL表中。

Ajax请求本身似乎有效，但在将新行插入SQL表之前它没有获取输入值：确实添加了新行，但所有其他值都设置为默认值，除了时间和日期是正确的。

我找了很多教程来检查我是否正确编写了我的Ajax函数，但我发现的只是jQuery Ajax教程，所以我真的不知道我在这里做错了什么。

HTML：

<form method="POST">
  value1: <input type="text" name="value1" maxlength="4"> <br>
  value2: <input type="text" name="value2" maxlength="4"> <br>
  value3: <input type="text" name="value3" maxlength="4"> <br>
</form>
<button onclick="send_ajax()"> Send</button>

Ajax功能：

function send_ajax() {
    console.log('function clicked');
    if (window.XMLHttpRequest) {
        //code for IE7+, Firefox, Chrome, Opera, Safari
        xmlhttp = new XMLHttpRequest();
    }
    else {
        //code for IE6, IE5
        xmlhttp = new ActiveXObject('Microsoft.XMLHTTP');
    }
    xmlhttp.onreadystatechange = function() {
        if (this.readyState == 4 && this.status == 200) {
            console.log('data sent');
        }
    }
    xmlhttp.open('POST', 'filled_inputs_test.php', true);
    xmlhttp.send();             
}

知道我做错了吗？

注意：考虑到我的php文件在不使用Ajax的情况下通过提交按钮调用时工作完全正常，我认为问题来自于Ajax在调用php文件之前没有获取我的输入值。

我没有添加php代码，因为它很长，但如果你需要检查它，请告诉我

Answer 1

您正在尝试发送空请求。尝试将发送部分更改为：

xmlhttp.send(new FormData(document.getElementsByTagName('form')[0]));

Answer 2

您没有在AJAX调用中发送输入值。使用：

xmlhttp.send("value1=" + encodeURIComponent(document.querySelector("input[name=value1]").value) +
             "&value2=" + encodeURIComponent(document.querySelector("input[name=value2]").value) +
             "&value3=" + encodeURIComponent(document.querySelector("input[name=value3]").value));

ajax将空值插入SQL表（POST方法）

2 个答案: