いつもお世話になってます。解決方法を教えてください。
抜粋します。
---
disp.php (元のphpファイル)
<form name="dispfm">
<?
$test1 = "test1";
$test2 = "test2";
?>
<select name="select1" onchange="get_msg(this)">
<option value="aaa"><?=$test1;?></option>
<option value="bbb" selected><?=$test2;?></option>
</select>
<textarea name="ta1"><?=$msg;?></textarea>
</form>
---
.js
function get_msg(obj){
var no = obj.form.select1.options[obj.form.select1.selectedIndex].value;
location.herf="chk.php?&type=select&no="+no;
//ここまでは通っていることは確認できている
}
---
chk.php
<?
if(type == "select"){
$query = "--- SQL ---";
$rlt = mysql_query($query);
$msg = mysql_result($rlt, 0);
//ここまでもalertにて通っていることを確認済み
//SQLも値とれている
?>
<script type="text/javascript">
<!--
document.dispfm.ta1.value = $msg;<---☆ここでjsエラー(Nullまたはー)
//★ここあたり
//-->
</script>
<?exit;
}
?>
---
☆の部分で「Nullまたはオブジェクトではありません」となり、
元のdisp.phpへ戻ることなく、nullページ(空白何も表示なし)となってしまいます。
ソースをみてもjs部分が書いてあるだけです。
form名とせずにform[0]でしてみたり、getElementByIdでも試しましたが、一向に動きません。
chk.phpでやりたいことは、選んだリストの値をもとに、SQLでtextareaにセットする値を取得する、それを画面を新たに読み込まずにセットしたい、また既に入力された他の値をそのまま残したい。
宜しくお願いします。
A 回答 (8件)
- 最新から表示
- 回答順に表示
No.8
- 回答日時:
全然関係ない話ですが、
XDomainRequest(IE8), XMLHttpRequest level2 なんてものがあったんですね。
時代の流れは速い。
========== http://xxx/resource.php =============================
header('Access-Control-Allow-Origin: http://yyy'); // 許可するドメイン
header('Content-Type: text/plain');
echo 'test';
========== http://yyy/sample.html ==============================
//@cc_on
function load(uri, output) {
var req = new /*@if(1) XDomainRequest() @else@*/ XMLHttpRequest() /*@end@*/;
req.open('GET', uri, true);
req.onload = function() {
output.nodeValue = req.responseText;
req.onload = new Function();
req = null;
};
req.send('');
}
<p>
<input type="button" onclick="load('http://xxx/resource.php', this.parentNode.querySelector('VAR').firstChild);"><var></var>
</p>
すげー。ごめ、覚書(無駄うち)です。
No.7
- 回答日時:
========== disp.php (元のphpファイル) ============================
<script type="text/javascript" src="chk.php" id="SCRIPT-CHK"></script><!-- エラーにならないところならどこでも -->
========== .js ==================================================
function get_msg(obj){
var chk = document.getElementById('SCRIPT-CHK');
chk.src = 'chk.php?type=select&no='+encodeURIComponent(obj.value);
}
========== chk.php ==============================================
if(type == "select"){
$query = "--- SQL ---";
$rlt = mysql_query($query);
$msg = mysql_result($rlt, 0);
$msg = str_replace("'", "\\'", $msg);
//header('Content-Type: application/javascript');
header('Content-Type: text/javascript');
echo<<<EOS
document.forms['dispfm'].elements['ta1'].value = '{$msg}';
EOS;
}
JSONP だとしても強引なやり方であることには変わりない。
=================================================================
ちなみに、(話がそれます)
document.dispfm.ta1.value
でも、やってることはほぼ同じです。
その他、
(1) document.dispfm.ta1
(2) document['dispfm']['ta1']
(3) docuemnt.form(s)[0].ta1
(4) docuemnt.form(s)['dispfm'].ta1
(5) document.form(s).item(0)
(6) document.form(s).namedItem('dispfm')
(7) document.form(s)['dispfm'].elements['ta1']
(8) document.form(s)['dispfm'].elements.item(0)|item[0]
(9) document.form(s)['dispfm'].elements.namedItem('ta1')|namedItem['ta1']
(10) document.getElemnetById('dispfm')....
(1)~(10)はどれもほぼ同じです。まだあるかもしれません。
以下、受け売りになりますが
(1), (2) はプロパティの衝突の恐れがあるため、好ましくありません。
たとえば
<form action="#" name="dispfm">
<p><input type="text" name="name"></p>
</form>
document.dispfm.name これは、フォームの name 属性値 'dispfm', input 要素、どちらを示すでしょうか?どちらの結果になったとしても好ましくはないでしょう。
省略形によるプロパティの衝突、使い勝手を考慮すると (7) が今のところもっとも無難な書き方です。
エラーの要因は書き方の問題ではなく dispfm, ta1 と名前の付けられた要素が存在しないとの単純ミスがほとんどです。
(#1 は、chk.php で form 要素を吐き出していると仮定してのコードです。)
ほとんどが呼び出すタイミング、要素が生成される前に呼び出している。
ただし、今回の場合は、chk.php に script 以外の要素が存在しないことによるものです。
解決策としては、JSONP でもいいですし、include で直生めして location でリロードしてもいいでしょう。
リロードせずということでしたら JSONP か AJAX
(つか、image でも iframe でも再読み込みさせる要素なら何でもいい。AJAX はセキュリティを考慮して、別ドメインにアクセスできないようになってるけど、JSONP は野放し状態。この辺詳しい人いないかな)
No.6
- 回答日時:
う~ん、、、URLを入れると確認中になるのかな?
No.5で話題に触れたJSONPで。
disp.phpで読み込んでいるであろう.jsファイル。
----------------
function get_msg(obj){
var no = obj.form.select1.options[obj.form.select1.selectedIndex].value;
var scr=document.createElement('script');
scr.setAttribute('src', "chk.php?&type=select&no="+no);
document.getElementsByTagName('head')[0].appendChild(scr);
}
----------------
chk.php
----------------
<?
type=$_GET['type'];
if(type == "select"){
$query = "--- SQL ---";
$rlt = mysql_query($query);
$msg = mysql_result($rlt, 0);
header("content-type: text/javascript");
?>
document.dispfm.ta1.value = <?php echo $msg; ?>;
<?exit;
}
?>
----------------
未検証です。
> 下記サイトでエラーになっている理由と同じと思います。
> http://www.confrage.com/javascript/form/geteleme …
必要なJavaScriptが書かれていないだけです。
サンプルとして表示されている部分をコピーして、テキストエディタで新しいファイルを作成、ペーストして保存した物をブラウザで表示して動作確認してみて下さい。
たぶん動くと思います。(CGI不要です)
No.5
- 回答日時:
> NO.3 補足
> これと同じような動きをしているPGではhtmlの記述はしていませんので、なんとかタグを入れずに動作させたいです。
動いているページがあるのなら、その作り方を参考にしてみて、そのマネをするのが良いと思います。
というか、動いているページのそれぞれのコードが何をしているのか、理解されるところから初めてもいいんじゃないでしょうか。。。
<script>すら入れないならJSONPやAjaxでしょうけど、
この質問文やコードから察すると、無理なんじゃないかな、、、とも思うわけで。。。
disp.phpの<form name="dispfm">と、chk.phpのdocument.dspfmという書き方から、やらんとしていることはわかりますけどね。(たぶんAjaxでしょう。)
JavaScriptを一切使わずに、
ページの内容を変更したい場合は毎回フォームを送信して、CGIだけでHTMLを生成する方が完成が近いんじゃないでしょうか?
ページ遷移をしたくないなら、インラインフレームを使う方法がありますので、この辺をご参考に。
http://home.wi-wi.jp/scripts/log/2006022001/inde …
AjaxやJSONPよりはわかるんじゃないかな、、、と思います。
Ajaxで作られるなら、No.2のコードを確認して下さい。
> No.4
> 正常動作してるほうは chk.php をインクルードしてませんか?
なるほど、、、
それならchk.phpの中でHTMLタグを使わなくても行けますね。
ただ、それだとlocation.href="chk.php・・・"から書き直さないと行けませんが。
No.4
- 回答日時:
> 教えて頂いた内容は理解できるのですが、ほぼ同じような状態で別ファイルでは動いているので、できれば同じ処理でやりたいです。
このファイルchk.phpだけ動かないのです。
正常動作しているPGがなぜ動くのかトレースしてみてください。
正常動作してるほうは chk.php をインクルードしてませんか?
> htmlタグは入れたくないのです。
SCRIPT 要素は OK なんですね。ごめんなさい、軽い突っ込みです。
ちなみに htmlタグは '<html>' これをさし、開始タグと終了タグが存在します。
PHP で J(ava)Script のプログラムを状況にあわせて印字するのもいいとおもいます。
==================================================================
希望の動作をかなえるだけでしたら、J(ava)Scriptは必要ないように思います。(#2 又は他の手法は省く)
繰り返しになりますが、chk.php は HTML の SCRIPT 要素と思われる文字列を印字しているに過ぎません。
==================================================================
> よそ様のサイトを勝手に掲載するのはまずいとは思いますが、
下記サイトでエラーになっている理由と同じと思います。
ttp://www.confrage.com/javascript/form/getelementbyid/getelementbyid.html
上記サイトでエラーが発生する理由は、コードの提示をしているだけで、実際には J(ava)Script として実装していないからです。
メンテナンスの過程で抜け落ちたのかもしれません。
No.3
- 回答日時:
chk.php
<!-- この部分を追加 -->
<form name="dispfm">
<input type="text" name="ta1">
</form>
<!-- 追加ここまで -->
<?
if(type == "select"){
$query = "--- SQL ---";
$rlt = mysql_query($query);
$msg = mysql_result($rlt, 0);
//ここまでもalertにて通っていることを確認済み
//SQLも値とれている
?>
<script type="text/javascript">
<!--
document.dispfm.ta1.value = $msg;//<---☆ここでjsエラー(Nullまたはー)
//★ここあたり
//-->
</script>
<?exit;
}
?>
JavaScriptはwindow.onloadで実行するか、<form>の後ろに<script>を書くようにして下さい。
PHPでvalue=""に入れる方が一般的だと思いますが、それはそれとして。
この回答への補足
ありがとうございます。
chk.phpには処理のみで、htmlタグは入れたくないのです。
これと同じような動きをしているPGではhtmlの記述はしていませんので、なんとかタグを入れずに動作させたいです。
>PHPでvalue=""に入れる方が一般的だと思いますが、それはそれとして。
はい。本当はそうしたいです。document.dispfm.ta1.value='hoge';
で、NULLまたはオブジェクトではありませんエラーになってしまって、いろいろやっているうちにgetElementByIdとして投稿させてもらっただけで、やれるなら素直にvalueに入れたいです。
よそ様のサイトを勝手に掲載するのはまずいとは思いますが、
下記サイトでエラーになっている理由と同じと思います。
ttp://www.confrage.com/javascript/form/getelementbyid/getelementbyid.html
No.2
- 回答日時:
========== disp.php (元のphpファイル) ============================
<script type="text/javascript">
//@cc_on
var get_msg = (function() {
var req, form;
return function (select) {
var data = 'type=select&no='+encodeURIComponent(select.value);
form = select.form;
req = new /*@if(1) ActiveXObject("Msxml2.XMLHTTP.3.0") @else@*/ XMLHttpRequest() /*@end@*/;
req.open('GET', 'chk.php'+'?'+data, true);
req.onreadystatechange = statechangeListener;
req.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
req.send('');
}
function statechangeListener() {
if (req.readyState == 4) {
if (req.status == 200) {
form.elements['ta1'].value = req.responseText;
}
req.onreadystatechange = new Function();
req = null;
}
}
})();
</script>
<form action="chk.php" name="dispfm" id="dispfm">
<p>
<select name="select1" onchange="get_msg(this);">
<option value="aaa"><? h($test1); ?></option>
<option value="bbb" selected><? h($test2); ?></option>
</select>
<textarea name="ta1"><? h($msg); ?></textarea>
</p>
</form>
========== chk.php ==============================================
<?php
if (isset($_GET)) {
if ($_GET['type'] == 'select') {
$query = "--- SQL ---";
$rlt = mysql_query($query);
$msg = mysql_result($rlt, 0);
header('Content-Type: text/plain');
echo $msg;
}
}
?>
No.1
- 回答日時:
========== disp.php (元のphpファイル) ===========================
<?
$test1 = "test1";
$test2 = "test2";
function h ($str) { echo htmlentities($str, ENT_QUOTES); }
?>
<form action="chk.php" name="dispfm" id="dispfm">
<p>
<select name="select1" onchange="get_msg(this);">
<option value="aaa"><? h($test1); ?></option>
<option value="bbb" selected><? h($test2); ?></option>
</select>
<textarea name="ta1"><? h($msg); ?></textarea>
</p>
</form>
---
========== .js ==================================================
function get_msg(select){
var no = select.value;
location.herf="chk.php?type=select&no="+encodeURIComponent(no);
}
---
========== chk.php ==============================================
<?
if(type == "select"){
$query = "--- SQL ---";
$rlt = mysql_query($query);
$msg = mysql_result($rlt, 0);
?>
<script type="text/javascript">
<!--
var form = document.getElementById('dispfm');
dispfm.elements['ta1'].value = '<? echo str_replace("'", "\\'"$msg ?>';
//-->
</script>
J(ava)Script のコード(HTML も同様)を PHP で出力する場合、PHP では変数の内容を印字しているに過ぎません。
J(ava)Script の文字列として認識させる場合は、クオーテーションで囲む必要があります。
> chk.phpでやりたいことは、選んだリストの値をもとに、SQLでtextareaにセットする値を取得する、それを画面を新たに読み込まずにセットしたい、また既に入力された他の値をそのまま残したい。
やるなら... (#2 以降)
この回答への補足
ありがとうございます。
上記を試してみましたが、「オブジェクトがありません」というエラーに変わりましたがやはり画面は空の状態です。
教えて頂いた内容は理解できるのですが、ほぼ同じような状態で別ファイルでは動いているので、できれば同じ処理でやりたいです。
このファイルchk.phpだけ動かないのです。
'>'が抜けているなど探しましたが、chk.php側でalert()のみだとちゃんと元.phpページが表示されるので、やはりdocumentの部分の書き方なのかと思います。
うっかりこういうことしてない?というようなことがありましたら、教えてください。
宜しくお願いします。
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- JavaScript sessionStorageを調べています。 1 2023/06/20 12:41
- JavaScript セレクトを全て選択されていないと、文字によるエラーメッセージを表示させるコードを調べています 2 2023/06/22 15:48
- JavaScript 以前の質問だと、どの条件でも配列が表示されてしまいます。 1 2022/07/09 11:40
- HTML・CSS ボタンをクリックした時に、入力フォームのすぐ下部に、「入力欄が空白です」というテキストメッセージが表 1 2022/04/27 16:25
- JavaScript 入力フォームの javascript で メールアドレスの正規チェックをを行い、ボタンをクリックして 2 2022/04/27 16:06
- PHP if(preg_match("/[^0-9]/",$gu_d)){意味を教えてください。 1 2022/05/06 05:37
- JavaScript switch文のswitch(n)の部分を複数の値にするか、if文に変えてほしいです。 1 2022/07/27 17:18
- JavaScript セレクトボックスで配列を呼び出したい。 1 2022/07/08 20:14
- JavaScript セレクトボックスを2つ選択してメッセージなどを表示するには。~運賃検索プログラムを完成させたい~ 1 2022/07/22 11:10
- JavaScript Javascriptが機能せず原因が分からないので教えて頂きたいです 3 2023/06/04 14:50
このQ&Aを見た人はこんなQ&Aも見ています
関連するカテゴリからQ&Aを探す
おすすめ情報
このQ&Aを見た人がよく見るQ&A
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
プルダウン 項目が多いので先頭...
-
Selectボックスの幅を自動で広...
-
html selectの内容を初期値に戻す
-
プルダウンとテキストの連動
-
テーブルにおける行(セルにプル...
-
javascriptでの2つのプルダウン...
-
Selectの中身をfor文で入れる
-
CSVファイルを読みこみ、プルダ...
-
プルダウン選択の連動
-
jQuery セレクトボックスで選択...
-
ブラウザの戻るボタンを押した...
-
セレクトの値を取得できない
-
【javascript・PHP】プルダウン...
-
マウスをブラウザの外に出した...
-
正規表現で複数マッチ条件で悩...
-
return trueとreturn falseの用...
-
【jsp/Java】チェックボックス...
-
リストボックス内の重複したも...
-
<JavaScript>tableタグを入力不...
-
onchangeイベントを強制的に発...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
プルダウン 項目が多いので先頭...
-
Selectボックスの幅を自動で広...
-
jQuery セレクトボックスで選択...
-
Selectの中身をfor文で入れる
-
html selectの内容を初期値に戻す
-
CSVファイルを読みこみ、プルダ...
-
JQuery selectが反映されない
-
セレクトの値を取得できない
-
セレクトを全て選択されていな...
-
セレクトメニューで選択された...
-
ブラウザの戻るボタンを押した...
-
javascriptでselectボックスの<...
-
リストボックスの項目の順番を...
-
現在時刻を取得してフォームのs...
-
onFocusOutが複数回呼ばれる!
-
セレクトボックスで現在選択さ...
-
【javascript・PHP】プルダウン...
-
document.form で nullまたは...
-
プルダウンで現在の年月日を取...
-
onchange等のイベントハンドラ...
おすすめ情報