私は次のコードを持っています:
<form action="" method="post">
<input type="submit" name="ok" value="ÓK">
</form>
<?php
if (isset($_POST['ok']))
{
printf "OK";
}
?>
ボタンが押された後に表示される別のhtmlコードが必要です
私はそれを行う方法がわかりません
次のようにします。
<form action="" method="post">
<input type="submit" name="ok" value="ÓK">
</form>
<?php
if (isset($_POST['ok']))
{
?>
<div>
<p>Your HTML-code here</p>
</div>
<?php
}
?>
printf "ok"; はどこにありますか。置く
?> <?php
そして、その間に新しいHTMLを配置できます
Ajaxでフォームを送信できます。純粋な JavaScript では、 XMLHttpRequestオブジェクトを使用できます。
ajax.php
簡単なファイルの例を次に示します。
<?php
if (isset($_POST['ok'])) {
// send some response here
var_export($_POST);
exit;
}
?>
<!DOCTYPE html>
<html><head>
<script type="text/javascript">
function ajax() {
var form = document.forms['form1'];
var queryString = 'test=' + form['test'].value + '&ok=' + form['ok'].value;
var xmlHttpReq = false;
var self = this;
if (window.XMLHttpRequest) { // Mozilla/Chrome/Opera/Safari/IE9+
self.xmlHttpReq = new XMLHttpRequest();
} else if (window.ActiveXObject) { // IE6-8
self.xmlHttpReq = new ActiveXObject("Microsoft.XMLHTTP");
}
self.xmlHttpReq.open('POST', 'ajax.php', true);
self.xmlHttpReq.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
self.xmlHttpReq.onreadystatechange = function () {
if (self.xmlHttpReq.readyState == 4) {
document.getElementById("result").innerHTML = self.xmlHttpReq.responseText;
}
}
self.xmlHttpReq.send(queryString); // send http request
return false; // disable submitting the form below and thus reloading the page
}
</script>
</head>
<body>
<form id="form1" action="" method="post" onsubmit="return ajax();">
<input type="text" name="test" value="test data" />
<input type="submit" name="ok" value="OK" />
</form>
<div id="result" style="background:#faa;"></div>
</body>
</html>
ボタンがクリックされたときに表示される HTML コードの別のチャンクを探している場合は、ボタンでonclick
イベントが発生したときに呼び出される JavaScript 関数が必要です。
私はJSが得意ではないので、これはOPの演習として残します