おーこれは便利だ。

この方法を使用した場合、submitボタンはFORMタグ内に記述する必要はありません。FORMタグ外の

<input type="button">

にsubmitボタンの役割を持たせるからです。

　
これにはjQueryを使用します。HEADタグ内に例として下記のscriptタグを書きます。

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
<script>
$(function(){
	$('#button1').click(function() {
        $('#example').attr('action', 'test1.cgi');
        $('#example').submit();
    });
    $('#button2').click(function() {
        $('#example').attr('action', 'test2.cgi');
        $('#example').submit();
    });
});
</script>

　
BODYタグ内に例として下記のFORM及びinput type=”button”があるとします

<form id="example" name="example" method="post" action="test0.cgi">
～ 中略　～
</form>

<input type="button" id="button1" name="button1">
<input type="button" id="button2" name="button2">

　
上記例の場合、button1をクリックするとFORMの内容はtest1.cgiに渡され処理され、button2をクリックするとtest2.cgiに渡されて処理されます（jQueryでformのaction属性の値を書き換えている）

　
このscriptについて説明すると

$(function(){
	$('#button1').click(function() {
        $('#example').attr('action', 'test1.cgi');
        $('#example').submit();
    });
    $('#button2').click(function() {
        $('#example').attr('action', 'test2.cgi');
        $('#example').submit();
    });
});

上記スクリプトのattr()の部分は、attr(‘属性名’, ‘値’) となり、FORMのaction属性の値をtest1.cgi又はtest2.cgiに変化させています。例えばFORM内の

<input type="hidden" id="hoge" name="hoge" value="">

のvalue属性の値をbuttonによって変化させたい場合は

$('#hoge').attr('value', '値を記入') 

としてやれば良いわけです。

これを利用すればPHPでも処理の変化を柔軟に行うことができます。便利ですね。

Facebook

Twitter

Linkedin

Pinterest

Tumblr

Related posts:

javascriptで簡易パスワード作成 ロリポップのサーバアップデート後、htaccessが使えなくなった