ajax SQLテーブルにnull値を挿入する（POSTメソッド）

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();    
} 

私が間違ってやっている任意のアイデア？

注：Ajaxを使用せずにサブミットボタンから呼び出すと、私のPHPファイルが完璧に動作することを考慮すると、問題は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));