別ウィンドウへのsubmitの挙動がおかしいです

質問

はじめまして。

ページ内の押下したボタン/リンクに応じて、それぞれ別の新しいウィンドウにフォームの値を渡して処理を行うプログラムを作成しています。

リンク1押下→ウィンドウAを開く→アドレス1に遷移
リンク2押下→ウィンドウBを開く→アドレス2に遷移
ボタン3押下→自画面でアドレス3に遷移

フォームは共通で、JavaScript内でウィンドウ及びアクションの指定を行っています。

しかし、実際に動かしてみると、以下の問題が起こりました。
・ウィンドウを開いた後、いつまでも遷移しない(する時もある)
・ウィンドウを開いた後、意図しないアドレスに遷移することがある
　具体的には、新規ウィンドウで、現在開いているアドレスへの遷移
・フォームの値が送信されないことがある(する時もある)

いろいろ調べてみたのですが、原因がわかりません。
お力を貸していただけないでしょうか。
文末に抜粋したソースを掲載します。

ブラウザはIE7、関連あるかは分かりませんが、PHPとsmartyを使っています。
宜しくお願いいたします。

【JavaScript部分】
function action1(){
document.form.action = "http://www.yahoo.co.jp"
document.form.target = "_self";
document.form.submit();
}

function action2(){
window.open("", 'win2', 'width=400, height=300');
document.form.action = "http://www.google.co.jp"
document.form.target = "win2";
document.form.submit();
}

function action3(){
window.open("", 'win3', 'width=400, height=300');
document.form.action = "http://www.msn.co.jp"
document.form.target = "win3";
document.form.submit();
}

【HTML部分】
<form name="form" method="post" action="">
<input type="text" name="text1" value="">
<a href="javascript:action2();">リンク1</a>
<a href="javascript:action3();">リンク2</a>
<input type="button" value="ボタン3" onClick="action1()">
</form>

回答No.4

hrm_mmm · ベストアンサー

タイミングの問題かと思われます。
window.open() で実際にwiindowを開くのに掛かる時間よりも早くsubmit() が実行されてしまうと、その後から、blank ファイルを開くので、submit情報が失われる。または、target名の同じwindowを同時に２つ開こうとしてコンフリクトしてしまうとか。
特にcpuが遅かったり、動作の重いブラウザでこの可能性があります。４－５年前には、この手の質問も結構見かけました。
目的としては、windowサイズ指定したくて、window.openを実行してるのかな？
その場合、window.open の戻り値を保持して、subwindowのonload で、submit実行するようにすれば確実のようにも思います。setTimeout で実行開始をずらすという手もあったけど、環境によって必要な時間はいろいろなので。
var t = "win2";
document.form.target = t;
var w = window.open("", t, /* 適宜指定省略 */);
w.onload = function(ff){
return function (){ ff.submit();};
}(document.form) ;

お礼

こんばんは。ご回答ありがとうございます。

window.openの目的は、親画面での入力に基づいたサブ情報を子画面で検索→親画面に設定する処理のためでした。
仰られたとおり、子ウィンドウのonLoad処理にてsubmitを行ったところ、問題なく動作することが確認できました。
確かにIE7での新しいウィンドウのオープンは時間がかかっていましたので、やはりタイミングの問題だったのだと思います。
ともあれ、ようやく問題解決できました。ありがとうございました。

参考までに修正内容を記述します。

function action2(){
w = window.open("", 'win2', 'width=400, height=300');
w.onLoad = actionnew("http://www.google.co.jp", "win2");
}

function actionnew(actionname, winname){
document.form.action = actionname;
document.form.target = winname;
document.form.submit();
}

回答No.3

fujillin

#1です。

＞ページ内の押下したボタン/リンクに応じて、それぞれ別の新しいウィンド
＞ウにフォームの値を渡して処理を行うプログラムを作成しています。
のところを見落として勘違いしてました。
（POSTの件はそれでわかりました）

であれば、フォームじゃないとうまくいかないので、No1で書いた1行にする案ではダメですね。
スルーしてください。失礼いたしました。

>>#2様
わざわざサンキューです。

お礼

回答を書いたタイミングで補足が＾＾；
わざわざありがとうございました、了解いたしました。

補足

質問の補足

ブラウザまたは環境の問題の可能性が高いようですが、
似たような事象が発生した、解決された方がいらっしゃるかもしれませんので、もう少し質問は〆ないでおかせていただきます。
何かありましたらお願いいたします。

回答No.2

askaaska

;がないことを除けば
実装自体おかしいところはないわよ。
となると、この場所以外のところに問題があるってことね。
ブラウザの問題とか
ここに記述していないものの問題とか
パソコンにインストールされている何かとか。

>>#1さん
POSTで送信するために
こういう実装をしているのね。

お礼

こんにちは。ご回答ありがとうございます。
セミコロンの件は質問投稿時のミスです、ご指摘ありがとうございます。

回答を頂いた後、Chromeで作動させて見たところ、問題なく動かす事ができました。
どうやらご指摘の通りブラウザまたは環境の問題だったようです。
ありがとうございました。

#補足もありがとうございました。

回答No.1

fujillin

↑でURL指定の行だけ「;」がないのはタイポ？
（URLの前後にスペースが入ってるのは、この掲示板のせいだと思うけど）
＞document.form.action = "～ttp://～.yahoo.co.jp";
そこを修正すれば、動くと思いますが？　（IE6ですが…）

ところで、わざわざsubmitを使用しているけど、ご質問文で例示のgoogleでは、それで遷移すると「POSTデータは無効です」みたいな表示になっちゃうけど問題ないのかなぁ？
どうせwindow.openを使っているのなら、そこでURL指定してお終いでよいのでは？（1行で終わるし）
window.open("～ttp://～.google.co.jp","win2","width=400,height=300");

action1も
location.href = "～ttp://～.yahoo.co.jp";
の1行ですむはず。

リンクタグとインプットタグが混在している理由が不明ですが、
リンクタグを使うなら、本来の使い方でターゲット指定とURL指定でジャンプできるので、javascriptを使う必要はないし、ボタンもリンクにしておけば、そのままリンクで済むし…
（ボタンは普通にはリンクできなかったっけ？）

また、フォームにしたり、スクリプトにしたりする必然性が不明ですが、どうしてもスクリプトにしたければ、いっそのこと全部<button type="button">みたいなものでも良いのでは？

お礼

こんにちは。ご回答ありがとうございます。

セミコロンは質問投稿用に編集した時に消してしまったようです、実ソースでは大丈夫です。
あと、URLも投稿用に適当に変えています。(確かにgoogleでは怒られますね)
一応、URLを変えた後もきちんと動作しなかったことは確認済です。

URL指定の件はaskaaska様が補足してくださった通りです。

＞リンクタグとインプットタグが混在
デザイン上の都合とかそんな感じです。説明不足ですみません。

＞フォームにしたり、スクリプトにしたり
省略させて頂いていますが、いろいろ他にも処理を行っていますので…。

ご指摘して頂いた箇所以外は特に問題はないと受け取らせて頂きました。
貴重なご回答ありがとうございました。