JQueryでFormのsubmitを調整する

Form内にbuttonを複数用意して
それぞれで送信先の変更と
押されたボタン毎に異なった情報を付加する必要があったので
その時の対応をメモ

buttonにクラスとデータの設定

classを適当に指定(今回はsubmit_button)
data属性を使って各ボタン毎のデータを設定します。

    <form action="actionURL" method="post">
        ...
        <button class="submit_button" data-action="actionURL_A" data-hoge="hage">遷移先A</html>
        <button class="submit_button" data-action="actionURL_B" data-hoge="piyo">遷移先B</html>
        ...
    </form>

JQueryでbuttonのonclickイベントを設定

JQueryのreadyで対象のclassに対して
onclickのイベントを設定する

    $(function(){
        $('.submit_button').on('click', function(){
            var form = $(this).parents('form');
            form.attr('action', $(this).data('action'));
            var hoge = $(this).data('hoge');
            $('<input>').attr({
                'type': 'hidden',
                'name': 'hoge',
                'value': hoge
            }).appendTo(form);
            form.submit();
        });
    })

やっている事

対象ボタンの親のForm取得

var form = $(this).parents('form');

data属性から値を取得してactionの書き換え

form.attr('action', $(this).data('action'));

追加したいデータをdata属性から取得

var hoge = $(this).data('hoge');

取得したデータをformに対してhiddenタグで追加する

$('<input>').attr({
    'type': 'hidden',
    'name': 'hoge',
    'value': hoge
}).appendTo(form);

formを送信する

form.submit();

2017/09/17追記

というか、button毎に送るデータが1種類だけなら
別に無理にhiddenタグ追加しないで

        <button class="submit_button" data-action="actionURL_A" name="hoge" value="hage">遷移先A</html>
        <button class="submit_button" data-action="actionURL_B" name="hoge" value="piyo">遷移先B</html>

にすりゃあいいですね。
もしnameとvalueを複数設定する必要があるのなら
その時はhiddenで追加する事で対応可能、という事で。