colorboxで呼び出したサブウィンドウで選択したラジオボタンの値を親ウィンドウに渡したい

Question

タイトルの通り、colorボックスで呼び出したサブウィンドウに配置したラジオボタンの値を親ウィンドウのhidden要素に渡したい

<!-- 子ウィンドウ -->
<script>
$(function(){
    $('#run').click(function(){
	if (!window.opener || window.opener.closed) {
	　　window.close();
	} else {
　　　　　　　var val = $('.sel:checked').val();
	　　var fm = window.opener.document.form;
           fm.s_no.value = val;
	　　parent.$.fn.colorbox.close(); return false;
	}
  });
});
</script>

現状
クリックイベントでの実行時エラー

TypeError: fm is undefined

親ウィンドウのformタグ名は「form」で間違っていない（以下）
そのフォーム中にname="s_no"のhidden要素は存在する

<!-- 親ウィンドウ -->
<link rel="stylesheet" href="/css/colorbox.css" />
<script src="/js/jquery.colorbox.js"></script>
<script>
  $(document).ready(function(){
	$(".ajax").colorbox({width:"70%", height:"70%", closeButton:true});
  });
</script>

<form role="form" method="post" action="" name="form">
<div class="row">
<input type="text" name="ex" value="YYY">
<p><a class="ajax" href="sub-win.php" title="">SUBウィンドウ</a></p>
<input type="hidden" name="s_no">
</div>
</form>

よろしくお願いいたします

colorboxについては以下を参照しました
http://www.jacklmoore.com/colorbox/

Comments

[kei344]

「親ウィンドウのformタグ」周りのHTMLも質問文に追記することをお勧めします。

[sakura-shi]

ありがとうございます
追記しました

[m.ts10806]

PHPは直接関係ないのでは（コードに出てきてませんし）

[sakura-shi]

直接には関係ないです。hidden値の処理で使用します。

[miyabi_pudding]

確認です。
子ウィンドウで表示するform要素は、iframeではなく、親HTML内のブロック、ということでよろしいですか？
また、現状のソースコードでは、他者はまったく再現できません。
省略しているHTMLも全て記載ください。

Answer 1

まず、colorbox始め、JavaScriptライブラリにおけるモーダルウィンドウにおいて、勘違いをされているように思えるので、そこから。
上記においてのモーダルウィンドウは、
別タブならびに別ウィンドウではありません。
あくまで、呼び出しの同HTML内で完結されるものであって、（外部HTMLを呼び出す場合も、iframe）、別タブ、別ウィンドウを出現させるものではないため、window.openerならびにそのオブジェクトメソッドで処理する、いわゆるポップアップウィンドウ系列の処理を行えません。（というかそれとは全く別物）

colorboxは、インラインのHTMLを表示させた場合、コールバック関数によって、対象の要素を取得することも可能ですので、それをうまく使えば良いのではないでしょうか。

<a href="#formWindow" id="run">colorboxで表示</a>

<div id="formWindow" style="display: none;">
<form role="form" method="post" action="" name="form">
<div class="row">
  <input type="text" name="ex" value="YYY">
  <input type="hidden" name="s_no">
</div>
</form>
</div>

<script>
$(function(){
$('#run').colorbox({
  inline: true,
  onOpen: function(target){
    // colorboxで表示を行った時点でのコールバック
    // targetには、#runのcolorboxでラッピングしたオブジェクトが入っている
    // 下記で、#formWindow要素を取得
    console.log($(target.el.hash)[0]);
  }
});

});
</script>

Comments

[sakura-shi]

ありがとうございました
親子という概念から離れたら解決しました