PHPの処理結果をjavascriptで利用する方法
既に似たような質問も出ていそうで恐縮ですが(一通り目を通したですが、目的とするものは見つけられませんでした)、
PHPとjavascriptのやりとりについて教えていただければ幸いです。
データをフォームなどから受け取る→サーバー側(php)で処理→
処理した結果の変数をjavascript用の変数として扱うといったこと
がしたいのですが、うまくできません。
実際には以下のような形で書いて失敗してしまいました。。。
/*xxx.php*/
<html>
<head>
<?php
$result = $_POST["sentence"];
?>
<script language="javascript">
result = "<?=$result?>";
</script>
<script src="xxx.js" type="text/javascript"language="javascript"></script>
</head>
<body>
<form id="sample">
<input type="text" name="sentence">
<input type="submit" value="送信">
</form>
</body>
</html>
/*xxx.js*/
/*xxx.js*/
window.onload = function(){
document.getElementById("sample").onsubmit = function() {
var req = createHttpRequest();
req.onreadystatechange = function(){
if(req.readyState==4 && req.status == 200){
alert(result);
//PHPの結果を待った後を想定した何らかの処理
//ここでresultを使いたいが、サーバー側への送信前
//の値が入っているだけでonsubmitが反映されていない。
}
}
req.open("POST","./xxx.php",false);
//<-formでくくられた<input type="text">等の部分は反映されない。
req.send("");
}
}
function createHttpRequest(){
if(window.XMLHttpRequest){
return new XMLHttpRequest();
} else if(window.ActiveObject){
try{
return new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try {
return new ActiveXObject("Microsoft.XMLHTTP");
} catch (e2) {
return null;
}
}
}
}
私なりに調べたところ
1.PHPとjavascriptは別の所で動作しているので受け渡しは基本不可能
2.PHP側で動的に書き出すことで見せかけることはできる。
var test = <?=$test?>等
3.XmlHttpRequestでphpの処理を結果を待って、変数を利用しようと思ったが、
<form id="form">
<input type="text" name="sentence">
<input type="submit" value="送信">
</form>
といった場合に$_POST["sentence"]に値を入れる方法が不明。
また、 multipart/form-dataによる送信など方法が複雑。
responseTextには<html>から</html>まで格納されてしまった。
処理項目ごとに表示用に別にPHPファイル作成だと困る。
4.<form action = "xxx.php" onsubmit=関数名>とすると、
onsubmitで指定した関数が先に呼び出されてから、
xxx.phpの実行が行われるので、サーバー処理を待たずに
javascript側が実行されてしまう。
といったことだけは分かりました。
しかし、どのように変更すればうまくいく(もしくは見せかける)
ようになるのかがさっぱり分からなかったため、
質問させていただきました。
よろしくお願い致します。