- ベストアンサー
javascriptからphpの呼び出し
javascriptの初心者です。宜しくお願い致します。 php5で、開発していますが、javascriptからphpを呼んで、 結果をリアルタイムに画面に表示させる方法が分かりません。 【やりたい事】 1.画面上に、現在の日時を表示させる。 2.5秒毎に、phpを呼び出し(DB接続し結果を取得)して、 その結果を、画面上に表示させる。 ※DBへの接続は、javascript内ではやりたくありません。 下記に、現在時刻を表示するjavascriptがありますが、 この中で、5秒毎に、phpを呼び出したいのですが、 出来るのでしょうか? </head> <script language="Javascript"> <!-- function time_disp() { d = new Date(); document.all.nowdate.value = d.toLocaleString(); window.setTimeout("time_disp()", 1000); } --> </script> <body onload="time_disp();"> <input type="text" name="nowdate" size="30" readonly> <input type="text" name="data1" readonly> ←phpから取得した値1 <input type="text" name="data2" readonly> ←phpから取得した値2 </body>
- みんなの回答 (4)
- 専門家の回答
質問者が選んだベストアンサー
AJAXを使って、面倒なのでname指定はid指定に変更 function time_disp() { d = new Date(); document.getElementById("nowdate") = d.toLocaleString(); var xmlHttp =(window.ActiveXObject)?new ActiveXObject("Msxml2.XMLHTTP"):new XMLHttpRequest(); xmlHttp.onreadystatechange = function(){ if (xmlHttp.readyState == 4 && xmlHttp.status == 200){ var data=eval("("+ xmlHttp.responseText + ")"); document.getElementById("data1").value = data["1"]; document.getElementById("data2").value = data["2"]; } }); xmlHttp.open("GET","PHPのプログラムのURI",true); xmlHttp.send(null); window.setTimeout("time_disp()", 1000); } phpは、{"1":"hoge","2":"fuga"}のような JSONデータを返す前提です。
その他の回答 (3)
- yyr446
- ベストアンサー率65% (870/1330)
訂正 });じゃなく};でした。 xmlHttp.onreadystatechange = function(){ if (xmlHttp.readyState == 4 && xmlHttp.status == 200){ var data=eval("("+ xmlHttp.responseText + ")"); document.getElementById("data1").value = data["1"]; document.getElementById("data2").value = data["2"]; } };
- yyr446
- ベストアンサー率65% (870/1330)
一定時間毎にmetaタグでリロード出来るのなら、 データをJSONPみたいな方法で受け渡す手もありそうです。 <head>に <script src="DBへアクセスするPHPのuri"></script> を加えておいて、 PHPはJSON形式みたいにdata={......}だけを出力するようにしておく。 javascriptはonloadの後にdataを参照して、お好きなところに DOM関数でセットすればよいかも。
お礼
ありがとうございます。 同画面内に入力フォームがあるので リロードしてしまうと、途中で消えてしまうので どうにか、出来ないかと思っている次第です。 色々なサイトを探して、サンプルが載っていたもので javascriptから、phpを呼んで見たのですが、 それも、うまく行かずにエラーになってしまいます。 記述方法のサンプルなど、ご教授願えないでしょうか。 宜しくお願い致します。
- yambejp
- ベストアンサー率51% (3827/7415)
ページ自体を読み直していいならmetaでリフレッシュしてやればよいでしょう。 一部データを更新するということであればajaxで処理してください。 5秒ごとに処理をいれると、DBへの負担があるかもしれません。
補足
ありがとうございます。 同画面内に入力フォームがあるので リロードしてしまうと、途中で消えてしまうので どうにか、出来ないかと思っている次第です。 DBへの負担があるようでしたら、秒数を変更する方向で 行く予定です。
お礼
丁寧に記述してくださり、ありがとうございます。 これで、うまく行きそうです。 まだ、javascriptも初心者で、ajaxも初めての 試みですが、こちらのソースで導入に向けて 勉強したいと思います。 本当にありがとうございました。