9
19

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

JavaScriptからPOST送信(同ウインドウ、ポップアップウインドウ)

Last updated at Posted at 2015-11-04

#概要
JavaScriptからpost送信したい、というときの汎用関数です。
jQueryを使っています。

##同ウインドウでpost送信する

・第一引数にジャンプ先のURL
・第二引数にセットするデータ名を配列でいれる
・第三引数にセットする値を配列でいれる(第二引数と同じ長さ)

function postJump(_url, _keys, _vals){
	var html = '<form method="post" action="'+_url+'" id="postjump" style="display: none;">';
	for(var cnt=0;cnt<_keys.length;cnt++){
		html += '<input type="hidden" name="'+_keys[cnt]+'" value="'+_vals[cnt]+'" >';
	}
	html += '</form>';
	$("body").append(html);
	$('#postjump').submit();
	$('#postjump').remove();
}

##ポップアップウインドウを開いて、そこにpost送信する

・第一引数にジャンプ先のURL
・第二引数にポップアップで開くウインドウ名
・第三引数にセットするデータ名を配列でいれる
・第四引数にセットする値を配列でいれる(第三引数と同じ長さ)

var popWinObj;
function popPostJump(_url, _win, _keys, _vals){
	$('#postjump').remove();
	if( (popWinObj) && (!popWinObj.closed) ){
		popWinObj.close();
	}
	popWinObj = window.open("about:blank",_win,"width=660,height=600,scrollbars=yes");
	var html = '<form method="post" action="'+_url+'" id="postjump" target="'+_win+'" style="display: none;">';
	for(var cnt=0;cnt<_keys.length;cnt++){
		html += '<input type="hidden" name="'+_keys[cnt]+'" value="'+_vals[cnt]+'" >';
	}
	html += '</form>';
	$("body").append(html);
	$('#postjump').submit();
	$('#postjump').remove();
}

#おわりに
特段新しいテクニックでもないですが、備忘録として。
それぞれ最後に .remove() していますが、これをしないと上記関数の複数回呼び出しでバグります。

9
19
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
9
19

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?