Loading

[jQuery] フォーム送信時(Submit時)にボタン毎に遷移先URLを変更する方法

150415322552_TP_V

「送信ボタンを複数配置して、押したボタンによって遷移するURLを変えたい」。そんな時、クライアントサイドのjQueryで実現できるようなコードをご紹介します!

概要

今回は、submitボタンに新たな属性を追加し、その属性に指定されたURLで遷移する先が決まるような仕組みで実装します!

  • 1. submitボタンに「actionURL」属性を追加する
  • 2. 各ボタンのactionURL属性に指定したURLにリンクするようjQueryコードを書く

ソースコード全体

htmlソースコード

HTML側は、submitボタンに対して「actionURL」属性を追加するのみです!

<input type="submit" actionURL="/index.php" value="送信する①">
<input type="submit" actinoURL="/complete.php" value="送信する②">

jQueryソースコード

jQuery側は、「actionURL」のあるモノを押した時に、formのaction先を変更して送信するようにしています!

$(document).ready(function(){
  $('[actionURL]').click(function(){
    if($(this).attr('actionURL') != ""){
      $('form').attr('action', $(this).attr('actionURL'));
    }
  });
});

いかがでしたでしょうか?何かございましたら、遠慮なくコメント欄にてご連絡下さい!

[jQuery] リアルタイムに入力フォームのバリデーションをチェックするコード集

[三国天武] 臥龍試験!クイズ回答まとめ(4周年祝典)

関連記事

  1. [CSS] CSSのみでデザインするおしゃれなヘッダー・見出し(h1~h6タグ)…

    2018.06.11
  2. [Excel VBA] マクロで対象ブックの印刷総枚数を取得する

    2016.06.21
  3. [PHP] 入力フォームのバリデーションチェックを実装する

    2016.05.09
  4. SSHでリモートコマンド実行、成功失敗の返り値(戻り値)取得方法

    2016.06.23
  5. [Linux] シェルスクリプトでフォルダ単位圧縮バックアップ & ロ…

    2018.01.09
  6. [Windows] コマンドプロンプトで簡単にファイル一覧を作成する方法!

    2017.11.08

コメント

  1. この記事へのコメントはありません。

  1. この記事へのトラックバックはありません。

CAPTCHA


New Article

  1. sangokutenbu_rendo6
  2. sangokutenbu_hukuryu
  3. 150415322552_TP_V
  4. ISG106130755_TP_V
  5. drtftgyuhij_TP_V
PAGE TOP