jQuery POSTでページ遷移

公開: 2014-09-13 09:10
更新: 2016-04-29 06:02

「このボタンを押したらPOSTでページ遷移させたい」
そんなときは多々あるわけですが毎回ボタンにformタグを埋め込むのは大変。


jQueryさんにやってもらいましょう。



こんな関数を用意

var postForm = function(url, data) {
        var $form = $('<form/>', {'action': url, 'method': 'post'});
        for(var key in data) {
                $form.append($('<input/>', {'type': 'hidden', 'name': key, 'value': data[key]}));
        }
        $form.appendTo(document.body);
        $form.submit();
};


使う時はこんな感じ

var data = {'name': 'あっきぃ', 'text': 'こんにちは!'};
postForm('/comment.php', data);

これでOK!



この記事をシェア
この記事へのコメント(2)
1: ねこ: 2015/04/09(木) 14:10:30 ID:4ooK03
このhiddenの内容を遷移先で受け取るにはどう書けばよいのでしょうか???
2: あっきぃ: 2015/04/09(木) 18:32:40 ID:wYR8HF
>>1
この例のようにPHPなら受け取り先(comment.php)で$_POST変数の中に送られた値が入ってます。
<?php

//例えば
//$_POST['name'] = 'あっきぃ';
//$_POST['text'] = 'こんにちは';
//みたいな感じで値が入っているよっ

$name = $_POST['name'];
$text = $_POST['text'];

echo $name.' '.$text; //表示

?>

のように。

これをさらにJavaScriptで受け取りたいならば
<script>
var name = '<?php echo $name ?>';
var text = '<?php echo $text ?>';
alert(name+' '+text);
</script>
みたいにやるとかの方法がありまする〜
この記事にコメントする
書き込む
あっきぃ(@appstars_aki)
Web、iOSなフリーランサーです。好きなものはお寿司です。でもお寿司は高いので普段は雑草とか拾ったドングリを食べています。お仕事や意味もなく毎月お小遣いをくれる人を探してます。

お仕事の依頼や自分で作ったアプリのレビューを希望しちゃう方はaki@appstars.jpまでご連絡ください。