PHPとJavaScriptの連携について
PHPとJavaScriptの連携をしたいと思いましたが、下記が分からなかったので、アドバイスいただける方がいらっしゃいましたら、ご教示の程よろしくお願いします。
1. 下記の親ウィンドウで子ウィンドウを開く後、テキストエリアに文字を入力し、値をセットボタンを押すと、「親ウィンドウ」の「値が渡せます」には値が渡せますが、「値が渡せません」には値が渡せません。
違いはnameをtext00からdata[text02]に変更したのみとなります。
2. 下記のソースでは、子ウィンドウのテキストエリアに入力した内容をそのまま渡してますが、子ウィンドウのテキストエリアの情報を基に、PHPでデータベースを検索し、ヒットしたものを親ウィンドウに渡したいと思います。
下記のソースを例にすると、「値をセット」ボタンを押した後、テキストエリアの値を子ウィンドウのSELECT文のidに設定し、取得した$tmpの内容を親ウィンドウに渡したいと思います。
なお、記載のSQL文はシンプルですが、実際には複数のフィールドの値を取り、idの値も複数あります(下記のデータベースを例にすると、idに1と2を渡した際、親ウィンドウのテキストエリアに「あいうえお かきくけこ」と表示させ、idの値を隠し項目でもっていたいと思います)。
3. 上記2で親ウィンドウにデータベースの値を渡した後、子ウィンドウを開くクリック時、子ウィンドウのテキストエリアに渡したidの値を表示したいと思います。
【index.html(親ウィンドウ)】
<script type="text/javascript">
<!--
function window_open() {
window.open('sub.php',null,'width=640, height=480, scrollbars=yes')
};
//-->
</script>
</head>
<body>
<form action="index.php" method="post" name="form00" id="form00">
<a onclick="window_open()" href="javascript:void(0)">子ウィンドウを開く</a>
<br />
値が渡せます
<input type="text" name="text00" value="" readonly="readonly" />
<br />
値が渡せません
<input type="text" name="data[text02]" value="" readonly="readonly" />
</form>
</body>
【sub.php(子ウィンドウ)】
<script type="text/javascript">
<!--
function Set() {
window.opener.document.form00.text00.value=document.form01.text01.value;
window.opener.document.form00.data[text02].value=document.form01.text01.value;
window.close();
}
//-->
</script>
</head>
<body>
<form action="index.php" method="post" name="form01" id="form01">
<input type="text" name="text01" />
<input type="button" onclick="Set()" value="値をセット" />
</form>
<?php
/*
$link=mysql_connect('localhost', 'データベースユーザ名', 'データベースパスワード名');
mysql_select_db('データベース名', $link);
$query=mysql_query("SELECT nm_master FROM master_db WHERE id=2", $link);
$tmp="";
while ($row=mysql_fetch_array($query)) {
$tmp .= $row["nm_master"];
}
echo $tmp;
mysql_close($link);
*/
?>
</body>
【データベース:master_db】
フィールド名:(`id`, `nm_master`)
(1, 'あいうえお'),
(2, 'かきくけこ');
以上、よろしくお願いします。
お礼
いろいろ試してみたらできました！ j_dataはphpで返した配列が入るとこであってるんですね！ val()もうまくできました！ 回答ありがとうございました！ホントに助かりました！
補足
回答ありがとうございます！ <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script> <script type="text/javascript"> $(function() { $("#btn").click(function(){ $.ajax({ type: "POST", url: "ajax.php", data: { "page": 2 //ここを2の代わりに$("#hoge").val()みたいにできますか？ }, success: function(j_data){ //ここのj_dataはphpで返した配列が入るとこなのでしょうか？j_dataでなくても名前はなんでもいいんですか？ // 処理を記述 } }); }); }); </script> 載せてもらったURLのコードでわからない部分があったので、//で質問させていただきました！ よろしくお願いします！