*子ウインドのデータを取得2 [#udc18dd3]

RIGHT:更新日 &lastmod(); 

** 子ウインドで入力した値の取得サンプル [#sab4a22f]
window.showModalDialogを使用するときはGoogle Map APIが子ウインドとして利用するときヘッダーの関係で子ウインドでMAPが表示しないのでwindow.openを使用する方法を示す~

***idを利用の例 [#m6158b88]
親ウインドのid="lat"で示された場所に子ウインドwindow.opener.document.getElementById("lat").valueが入る。このidでお互いの場所を関係づける。~
この場合はTextBox以外にidが設定できる要素であればすべてOKなようです。

''親ウインド''
 <html>
 <body>
 
 データ  <BR>
 緯度:<INPUT TYPE="TEXT" SIZE="40" id="lat" name="map_latitude"><br>
 経度:<INPUT TYPE="TEXT" SIZE="40" id="lng" name="map_longitude"><br>
 
 <!-- Textbox以外も文字列の中にも入る -->
 緯度:
 <p id="lat">未定</p>
 
 <script type="text/JavaScript">
 <!--
 function winOpen(theURL,winName,features) { //v2.0
  window.open(theURL,winName,features);
 }
 //-->
 </script>
 
 <!--ボタン表示 -->
  <INPUT TYPE="button" VALUE="入力" ONCLICK="winOpen \
 ('input3.php','newWindow','scrollbars=yes width=850,height=750' )">
 <BR>
 <!--リンク表示 -->
 <p><a href="#" onclick="winOpen('input3.php','newWindow','scrollbars=yes \
 width=850,height=750' )">新しいウインドウを開く!</a></p>
 </html>

''子ウインド''(input3.php)~
 <html>
 <head>
 <script type="text/javascript">
 function change(){
  window.opener.document.getElementById("lat").value=document.f.lat.value;
  window.opener.document.getElementById("lng").value=document.f.lng.value;
  window.close();
 }
 </script>
 </head>
 
 <body>
    緯度:<INPUT TYPE ="TEXT" NAME ="lat" SIZE = "25" style="ime-mode:disabled;">&nbsp;&nbsp;&nbsp;&nbsp;
    緯度:<INPUT TYPE ="TEXT" NAME ="lat" SIZE = "25" style="ime-mode:disabled;">&nbsp;&nbsp;
    経度:<INPUT TYPE ="TEXT" NAME ="lng" SIZE = "25" style="ime-mode:disabled;"><BR>
 
 <p><input type="button" value="OK" onclick="change();">
 <input type="button" value="キャンセル" onclick="window.close();"></p>
 
 </body>
 </html>


***FormのNameを利用する [#hd6b84d1]

親ウインドのFormに<Form Name = "f">のように名前をつけてそこにデータを渡す

''子ウインド''(input3.php)~
 <html>
 <head>
 <script type="text/javascript">
 function change(){
  window.opener.document.f.lat.value=document.f.lat.value;
  window.opener.document.f.lng.value=document.f.lng.value;
  window.close();
 }
 </script>
 </head>

トップ   編集 差分 バックアップ 添付 複製 名前変更 リロード   新規 一覧 検索 最終更新   ヘルプ   最終更新のRSS