あなたに試してみたいことの非常に基本的な例を示しましょう。
フォームと結果を格納するdivを持つHTMLページがあります。 この文書では、フォーム送信イベントを処理するためのJavaScriptコードも少しあります。Ajaxのクエリでは、jQueryを使用して怠け者でした。あなたのコードでそのライブラリを使用できない場合は、私にそれを知らせてください。
myPage.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
</head>
<body>
<div>
<form id="myForm"><!--Note there's no methods here-->
<input id="inputFirst" type="number" placeholder="first" name="first">
<input id="inputLast" type="number" placeholder="last" name="last">
<input type="submit">
</form>
</div>
<div id="divResults">
<!--Results will be displayed here-->
</div>
</body>
</html>
同じ文書（myPage.html）でJavascriptコード。
<!--Loading jQuery for easy Ajax methods-->
<!--(You can download it to your server)-->
<script src="http://code.jquery.com/jquery-3.1.0.min.js" type="text/javascript"></script>
<script>
// These first sentences aren't even necessary in main browsers
var divResults = window.document.getElementById("divResults");
var myForm = window.document.getElementById("myForm");
var inputFirst = window.document.getElementById("inputFirst");
var inputLast = window.document.getElementById("inputLast");
// Listening for submit button
myForm.addEventListener('submit', sendMyAmazingAjax);
function sendMyAmazingAjax(e) {
// To avoid the form to be send by direct post method
e.preventDefault();
$.ajax({
url: 'myAmazingScript.php', // These are well self explained
type: 'post',
data: {
first: inputFirst.value, // Content of form inputs
last: inputLast.value
},
success: function (data) {
// data is anything you "echo" in the PHP document
// We add it to the current contents of divResults (if any)
divResults.innerHTML += data;
}
});
}
</script>
今すぐ別のドキュメント（myAmazingScript.php）におけるいくつかのPHP。 （同じ文書でも同じことができますが、もう少し扱いにくく、必要ではありません）。
データベースへのクエリにどの方法を使用しているのかわかりません。私はこの例のために用意されたステムを選択しました。これは安全で、簡単で、しかも非常に拡張されているからです。
<?php
// Creating connection
$mysqli = new mysqli('localhost', 'user', 'password', 'myAmazingDatabase');
// Checking connection
if (mysqli_connect_errno()) {
echo "Connect failed: %s\n", mysqli_connect_error();
exit();
}
$first = $_POST["first"];
$last = $_POST["last"];
$query = "SELECT * FROM posts ORDER BY TimeStamp DESC LIMIT ?, ?";
if ($stmt = $mysqli->prepare($query)) {
$stmt->bind_param('ii', $first, $last);
$stmt->execute();
$result = $stmt->get_result();
while ($row = $result->fetch_assoc()) {
echo 'First field: ' . $row['myAmazingFirstField'] . '<br>';
echo 'Second field: ' . $row['myAmazingSecondField'] . '<br>';
// Etc...
}
$stmt->free_result();
$stmt->close();
}
私はそれを試していないが、私は何か重要なことを忘れていないと思う。ご質問がある場合はお知らせください。
（もちろん、あなたは多くの「驚異の名前」を変更する必要があります）
あなたは 'LIMIT' – Stivan
あなたが送信ボタンをクリックするたびに、あなたが経由してフォームを送信していることがある問題をせずに試してみましたポストし、ページがリロードされます。同じページで異なるクエリの結果を追加する場合は、AJAXを使用して行う必要があります。 – nanocv
これらの両方に同意します。あなたのページがリロードされないようにAjaxがページ設定されたデータを取得するか、最初に$を無視して常に0に設定してください。ajaxは正しい方法です。 – JNevill